html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video {
    margin: 0;
    padding: 0px;
    border: 0;
    font-size: 100%;
    outline: none
}

html {
    font-size: 100%;
    -webkit-text-size-adjust: 100%;
    -ms-text-size-adjust: 100%;
    overflow-x: hidden;
    -moz-osx-font-smoothing: grayscale;
    -webkit-font-smoothing: antialiased;
    text-rendering: optimizeLegibility
}

body, button, input, select, textarea {
    font-size: 12px;
    color: #555;
    font-family: "Arial", "Microsoft YaHei";
    text-rendering: optimizeLegibility;
    -webkit-font-smoothing: antialiased
}

h1, h2, h3, h4, h5, h6 {
    font-size: 100%
}

address, cite, dfn, em, var {
    font-style: normal
}

code, kbd, pre, samp {
    font-family: courier new, courier, monospace
}

input, button, select, textarea {
    outline: none
}

textarea {
    resize: none
}

ul, ol {
    list-style: none
}

a {
    text-decoration: none;
    color: #555;
    cursor: pointer;
    transition: all .5s
}

a:hover {
    text-decoration: none;
    color: #000;
    outline: none;
    hide-focus: expression(this.hideFocus=true)
}

.pic>img {
    display: block;
    width: 100%;
    transition: 600ms;
    -webkit-transition: 600ms
}

* {
    box-sizing: border-box
}

.slick-slider {
    position: relative;
    display: block;
    box-sizing: border-box;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    -webkit-touch-callout: none;
    -khtml-user-select: none;
    -ms-touch-action: pan-y;
    touch-action: pan-y;
    -webkit-tap-highlight-color: transparent
}

.slick-list {
    position: relative;
    overflow: hidden;
    display: block;
    margin: 0;
    padding: 0
}

.slick-list:focus {
    outline: none
}

.slick-loading .slick-list {
    background: #00865e url(../images/loader.gif) center center no-repeat
}

.slick-list.dragging {
    cursor: pointer;
    cursor: hand
}

.slick-slider .slick-list, .slick-track, .slick-slide, .slick-slide img {
    -webkit-transform: translate3d(0, 0, 0);
    -moz-transform: translate3d(0, 0, 0);
    -ms-transform: translate3d(0, 0, 0);
    -o-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0)
}

.slick-track {
    position: relative;
    left: 0;
    top: 0;
    display: block;
    zoom: 1
}

.slick-track:before, .slick-track:after {
    content: "";
    display: table
}

.slick-track:after {
    clear: both
}

.slick-loading .slick-track {
    visibility: hidden
}

.slick-slide {
    float: left;
    height: 100%;
    min-height: 1px;
    display: none
}

.slick-slide img {
    display: block
}

.slick-slide.slick-loading img {
    display: none
}

.slick-slide.dragging img {
    pointer-events: none
}

.slick-initialized .slick-slide {
    display: block
}

.slick-loading .slick-slide {
    visibility: hidden
}

.slick-vertical .slick-slide {
    display: block;
    height: auto;
    border: 1px solid transparent
}

.slick-prev, .slick-next {
    position: absolute;
    display: block;
    height: 20px;
    width: 20px;
    line-height: 0;
    font-size: 0;
    cursor: pointer;
    background: transparent;
    color: transparent;
    padding: 0;
    border: none;
    outline: none
}

.slick-dots {
    position: absolute;
    bottom: -45px;
    list-style: none;
    display: block;
    text-align: center;
    padding: 0px;
    width: 100%
}

.slick-dots li {
    position: relative;
    display: inline-block;
    height: 20px;
    width: 20px;
    margin: 0px 5px;
    padding: 0px;
    cursor: pointer
}

.slick-dots li button {
    border: 0;
    background: transparent;
    display: block;
    height: 20px;
    width: 20px;
    outline: none;
    line-height: 0;
    font-size: 0;
    color: transparent;
    padding: 5px;
    cursor: pointer;
    outline: none
}

.slick-dots li button:focus {
    outline: none
}

@-webkit-keyframes scaleUpDown {
    from {
        -webkit-transform: scale(1.08);
        transform: scale(1.08)
    }
    to {
        opacity: 1;
        -webkit-transform: scale(1);
        transform: scale(1)
    }
}

@keyframes scaleUpDown {
    from {
        -webkit-transform: scale(1.08);
        transform: scale(1.08)
    }
    to {
        opacity: 1;
        -webkit-transform: scale(1);
        transform: scale(1)
    }
}

@font-face {
    font-family: "jisa_icon";
    src: url("//at.alicdn.com/t/font_510350_po2vvu15accmobt9.eot?t=1515058326493");
    src: url("../fonts/font_510350_po2vvu15accmobt9.eot") format("embedded-opentype"), url("../fonts/17d120b53ce8478786b2a90a89dcddc3.woff") format("woff"), url("../fonts/font_510350_po2vvu15accmobt9.ttf") format("truetype"), url("../fonts/font_510350_po2vvu15accmobt9.svg") format("svg")
}

.jisa_icon {
    font-family: "jisa_icon" !important;
    font-size: 16px;
    font-style: normal;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale
}

.jisa-right:before {
    content: "\e620"
}

.jisa-top:before {
    content: "\e63c"
}

.jisa-bottom:before {
    content: "\e63d"
}

.jisa-left:before {
    content: "\e63e"
}

.jisa-tel:before {
    content: "\e600"
}

.jisa-baidu:before {
    content: "\e62b"
}

.jisa-pingjia:before {
    content: "\e641"
}

.fl {
    float: left
}

.fr {
    float: right
}

.ovh {
    overflow: hidden
}

.por {
    position: relative
}

.content1320 {
    max-width: 1320px;
    margin: auto;
    position: relative;
    height: auto;
    width: 96%;
}

.spot {
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    background: url(../images/spot.png);
}

.poaFull {
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0
}

.centerFull {
    width: 100%;
    height: 100%;
    position: absolute;
    top: 50%;
    left: 50%;
    margin: -50% 0 0 -50%
}

.clearfix:before, .clearfix:after {
    display: table;
    content: "";
    line-height: 0px
}

.clearfix:after {
    clear: both
}

.clearfix {
    *zoom: 1
}

.wrap1200 {
    width: 1200px;
    margin: auto
}

.w1400 {
    width: 1400px;
    margin: auto
}

.trans, .trans:hover {
    -webkit-transition: all 0.8s cubic-bezier(0.19, 1, 0.22, 1) 0s;
    -moz-transition: all 0.8s cubic-bezier(0.19, 1, 0.22, 1) 0s;
    -o-transition: all 0.8s cubic-bezier(0.19, 1, 0.22, 1) 0s;
    transition: all 0.8s cubic-bezier(0.19, 1, 0.22, 1) 0s;
    -ms-transition: all 0.8s cubic-bezier(0.19, 1, 0.22, 1) 0s
}

.trans-fast, .trans-fast:hover {
    -webkit-transition: all 200ms ease-in-out;
    -moz-transition: all 200ms ease-in-out;
    -o-transition: all 200ms ease-in-out;
    transition: all 200ms ease-in-out;
    -ms-transition: all 200ms ease-in-out
}

.menu-handler {
    background: none;
    overflow: hidden;
    width: 60px;
    height: 60px;
    cursor: pointer;
    position: absolute;
    right: 26px;
    top: 50%;
    margin-top: -30px;
    transition: all 0.3s cubic-bezier(0.445, 0.145, 0.355, 1);
    -webkit-transition: all 0.3s cubic-bezier(0.445, 0.145, 0.355, 1);
    -moz-transition: all 0.3s cubic-bezier(0.445, 0.145, 0.355, 1);
    z-index: 1012
}

.menu-handler .burger {
    width: 32px;
    height: 4px;
    background: #707070;
    display: block;
    position: absolute;
    z-index: 5;
    top: 18px;
    left: 50%;
    margin: 0px 0px 0px -16px;
    transform-origin: center;
    -webkit-transform-origin: center;
    -moz-transform-origin: center;
    -o-transform-origin: center;
    -ms-transform-origin: center
}

.menu-handler .burger-2 {
    top: 28px
}

.menu-handler .burger-3 {
    top: 38px
}

.menu-handler.active .burger-1 {
    top: 30px;
    -moz-transform: rotate(225deg);
    -webkit-transform: rotate(225deg);
    -o-transform: rotate(225deg);
    -ms-transform: rotate(225deg);
    transform: rotate(225deg)
}

.menu-handler.active .burger-2 {
    -ms-filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=0);
    filter: alpha(opacity=0);
    opacity: 0;
    -moz-opacity: 0;
    -khtml-opacity: 0;
    -webkit-opacity: 0;
    left: -100%
}

.menu-handler.active .burger-3 {
    top: 30px;
    -moz-transform: rotate(-225deg);
    -webkit-transform: rotate(-225deg);
    -o-transform: rotate(-225deg);
    -ms-transform: rotate(-225deg);
    transform: rotate(-225deg)
}

.bot {
    width: 0px;
    position: absolute;
    left: 50%;
    bottom: 0px;
    height: 2px;
    background-color: #23455b;
    transition: 0.3s;
    -webkit-transition: 0.3s
}

a:hover .bot, .active .bot {
    width: 100%;
    margin-left: -50%
}

.gray img {
    -webkit-filter: grayscale(100%);
    -moz-filter: grayscale(100%);
    -ms-filter: grayscale(100%);
    -o-filter: grayscale(100%);
    filter: grayscale(100%)
}

.scapic:hover img {
    transform: scale(1.1);
    -webkit-transform: scale(1.1)
}

.circle {
    display: block;
    width: 68px;
    height: 68px;
    border-radius: 68px;
    position: absolute;
    top: 50%;
    left: 50%;
    margin: -34px 0 0 -34px;
    z-index: 2;
    cursor: pointer
}

.circle .y1 {
    width: 100%;
    height: 100%;
    border-radius: 50%;
    background-color: #ffffff;
    display: block;
    position: absolute;
    left: 0px;
    top: 0px;
    transition: all 0.5s ease 0s;
    -webkit-transform: all 0.5s ease 0s
}

.circle .y2 {
    width: 100%;
    height: 100%;
    border-radius: 50%;
    background-color: #05b7db;
    display: block;
    position: absolute;
    left: 0px;
    top: 0px;
    transform: scale(0.6);
    -webkit-transform: scale(0.6);
    opacity: 0;
    -moz-transition: all 0.6s cubic-bezier(0.445, 0.145, 0.355, 1);
    -o-transition: all 0.6s cubic-bezier(0.445, 0.145, 0.355, 1);
    -ms-transition: all 0.6s cubic-bezier(0.445, 1.045, 0.355, 1);
    transition: all 0.6s cubic-bezier(0.445, 0.145, 0.355, 1);
    visibility: hidden
}

.circle:hover .y1 {
    opacity: 0;
    transform: scale(1.3);
    -webkit-transform: scale(1.3)
}

.circle:hover .y2 {
    transform: scale(1);
    -webkit-transform: scale(1);
    opacity: 1;
    visibility: visible
}

.more {
    border: 1px solid #fff;
    width: 204px;
    height: 48px;
    line-height: 48px;
    margin: auto;
    font-size: 14px;
    text-align: center;
    display: block;
    position: relative;
    overflow: hidden
}

.more .i2 {
    width: 0;
    height: 0;
    -webkit-transform: rotate(360deg);
    border-style: solid;
    border-width: 0 0 0 0;
    border-color: transparent transparent transparent #fff;
    position: absolute;
    bottom: 0;
    left: 0;
    -webkit-transition: all 0.5s;
    -moz-transition: all 0.5s;
    transition: all 0.5s
}

.more .i3 {
    width: 0;
    height: 0;
    -webkit-transform: rotate(360deg);
    border-style: solid;
    border-width: 0 0 0 0;
    border-color: transparent #fff transparent transparent;
    position: absolute;
    top: 0;
    right: 0;
    -webkit-transition: all 0.5s;
    -moz-transition: all 0.5s;
    transition: all 0.5s
}

.more .i1 {
    position: relative;
    z-index: 2;
    -webkit-transition: all 0.3s;
    -moz-transition: all 0.3s;
    transition: all 0.3s;
    color: #fff
}

.more:hover {
    border-color: #fff
}

.more:hover .i1 {
    color: #323232
}

.more:hover .i2 {
    border-width: 140px 0 0 140px
}

.more:hover .i3 {
    border-width: 0 140px 140px 0
}

.nmore {
    position: relative;
    display: block;
    width: 178px;
    height: 43px;
    line-height: 43px;
    background: #333;
    color: #fff;
    margin: 0 auto;
    font-weight: bold;
    text-align: center;
    transition: 0.3s
}

.nmore .aw {
    display: inline-block;
    transition: none;
    -webkit-transition: none;
    vertical-align: middle;
    position: relative;
    width: 30px;
    height: 100%;
    background: url(../images/see.png) no-repeat left center;
    margin-right: 10px
}

.nmore .bg {
    height: 100%;
    background: #b28a4c;
    width: 0;
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    transition: 0.3s
}

.nmore .txx {
    display: inline-block;
    position: relative;
    font-size: 14px;
    color: #fff;
    vertical-align: middle
}

.nmore:hover .aw {
    background-position: left center
}

.nmore:hover .txx {
    color: #fff
}

.nmore:hover .bg {
    width: 100%
}

.header {
    width: 100%;
    height: 77px;
    /*background: url(../images/bg.png);*/
    position: absolute;
    top: 0;
    left: 0;
    z-index: 5
}

.header .logo {
    padding: 12px 30px;
    float: left
}

.header .menu {
    position: absolute;
    top: 0;
    right: 0;
    height: 77px;
    display: flex;
    width: 75%;
    max-width: 1000px;
    margin-right: 20px;
    overflow: hidden
}

.header .menu a {
    color: #fff;
    width: 12%;
    margin: 0 0.25%;
    font-size: 16px;
    line-height: 77px;
    text-align: center;
    position: relative;
    text-transform: uppercase;
    transition: all .5s ease-in;
    float: left
}

.header .menu a:hover, .header .menu a.active {
    color: #ffffff;
}

.header .menu a:hover .bot, .header .menu a.active .bot {
    width: 80px;
    margin-left: -40px
}

.header2 {
    width: 100%;
    height: 60px;
    position: fixed;
    top: 0;
    left: 0;
    z-index: 3;
    background: #fff;
    opacity: 0;
    visibility: hidden;
    transform: translateY(60px);
    box-shadow: 0px 4px 8px rgba(0, 0, 0, 0.25);
    -webkit-transform: translateY(60px);
    -ms-transform: translateY(60px);
    -moz-transform: translateY(60px);
    -o-transform: translateY(60px);
    transition: 600ms;
    -webkit-transition: 600ms
}

.header2.show {
    transform: translate(0);
    -webkit-transform: translate(0);
    -moz-transform: translate(0);
    -ms-transform: translate(0);
    -o-transform: translate(0);
    opacity: 1;
    visibility: visible
}

.header2 .htnavbox {
    height: 100%;
    overflow: hidden;
    position: relative;
    text-align: center
}

.header2 .htnavbox.showNav .httnav {
    transform: translateX(-80px);
    -webkit-transform: translateX(-80px);
    -ms-transform: translateX(-80px);
    -moz-transform: translateX(-80px);
    -o-transform: translateX(-80px);
    opacity: 0;
    visibility: hidden
}

.header2 .htnavbox.showNav .htnav {
    transform: translate(0);
    -webkit-transform: translate(0);
    -moz-transform: translate(0);
    -ms-transform: translate(0);
    -o-transform: translate(0);
    opacity: 1;
    visibility: visible
}

.header2 .htnavbox .httnav, .header2 .htnavbox .htnav {
    transition: 600ms;
    -webkit-transition: 600ms;
    position: absolute;
    right: 95px;
    left: 0;
    top: 0
}

.header2 .htnavbox .httnav a, .header2 .htnavbox .htnav a {
    display: inline-block;
    height: 60px;
    line-height: 60px;
    color: #707070;
    font-size: 15px;
    padding: 0px 20px;
    text-transform: uppercase;
    position: relative
}

.header2 .htnavbox .httnav a:hover, .header2 .htnavbox .httnav a.act, .header2 .htnavbox .htnav a:hover, .header2 .htnavbox .htnav a.act {
    color: #a2192b
}

.header2 .htnavbox .htnav {
    transform: translateX(80px);
    -ms-transform: translateX(80px);
    -moz-transform: translateX(80px);
    -o-transform: translateX(80px);
    -webkit-transform: translateX(80px);
    opacity: 0;
    visibility: hidden
}

.header2 .logo2 {
    padding: 14px 30px;
    display: block;
    float: left
}

.header2 .logo2 img {
    display: block;
    width: 100%
}

.subNavBox {
    position: fixed;
    top: 77px;
    left: 0;
    right: 0;
    z-index: 22;
    background: #00000047;
    display: none
}

.subNavBox .subNav {
    display: none;
    transform: translateX(80px);
    -ms-transform: translateX(80px);
    -moz-transform: translateX(80px);
    -o-transform: translateX(80px);
    -webkit-transform: translateX(80px);
    opacity: 0;
    visibility: hidden
}

.subNavBox .act {
    display: block;
    transform: translate(0);
    -webkit-transform: translate(0);
    -moz-transform: translate(0);
    -ms-transform: translate(0);
    -o-transform: translate(0);
    opacity: 1;
    visibility: visible
}

.subNavBox .subNav1 {
    width: 864px;
    margin: 0px auto;
    /*padding: 20px 0;*/
    overflow: hidden
}

.subNavBox .subNav1 .subNavList {
    width: 370px;
    float: left;
    padding: 30px 0;
    
}

.subNavBox .subNav1 .subNavList a {
    display: inline-block;
    width: 48%;
    padding: 15px 0;
    font-size: 14px;
    text-align: left;
    position: relative;
    color: #fff;
}

.subNavBox .subNav1 .subNavList a:hover .bot {
    width: 100%;
  
}

.subNavBox .subNav1 .img {
    float: right;
    display: block;
    width: 408px;
    overflow: hidden
}

.subNavBox .subNav1 .img img {
    width: 100%;
    display: block;
    -webkit-transition: 0.6s;
    -moz-transition: 0.6s;
    -o-transition: 0.6s;
    transition: 0.6s
}

.subNavBox .subNav1 .img:hover img {
    -webkit-transform: scale(1.1);
    transform: scale(1.1);
    opacity: 0.8;
    filter: alpha(opacity=80)
}

.subNavBox .subNav3 .subNavList2 {
    width: 864px;
    margin: 0px auto
}

.subNavBox .subNav3 .subNavList2 a {
    display: block;
    float: left;
    width: 90%;
    padding: 32px 0 10px 0;
    font-size: 15px;
    color: #434343;
    text-align: center;
    position: relative
}

.subNavBox .subConPage {
    position: relative;
    width: 796px;
    margin: 32px auto
}

.subNavBox .subConPage .img {
    float: right;
    display: block;
    width: 408px;
    background-color: #000;
    overflow: hidden
}

.subNavBox .subConPage .img img {
    width: 100%;
    display: block;
    -webkit-transition: 0.6s;
    -moz-transition: 0.6s;
    -o-transition: 0.6s;
    transition: 0.6s
}

.subNavBox .subConPage .img:hover img {
    -webkit-transform: scale(1.1);
    transform: scale(1.1);
    opacity: 0.8;
    filter: alpha(opacity=80)
}

.subNavBox .subConPage .con {
    width: 226px;
    height: 186px;
    padding: 40px 0px 0px;
    float: left;
    display: block;
    border-bottom: 1px solid #e0e0e0;
    border-top: 1px solid #e0e0e0;
    background: #fff
}

.subNavBox .subConPage .con .c {
    font-size: 14px;
    height: 101px;
    overflow: hidden;
    margin-bottom: 20px;
    line-height: 25px
}

.subNavBox .subConPage .con .cmore {
    display: block;
    position: relative;
    font-size: 12px
}

.subNavBox .subConPage .con .cmore .ico {
    position: absolute;
    right: 0px;
    top: 50%;
    margin-top: -5px;
    width: 11px;
    height: 11px;
    background: url(../images/more_i1.png) no-repeat;
    display: block;
    transition: 400ms;
    -webkit-transition: 400ms
}

.subNavBox .subConPage .con .cmore:hover .ico {
    -moz-transform: rotate(90deg);
    -webkit-transform: rotate(90deg);
    -o-transform: rotate(90deg);
    -ms-transform: rotate(90deg);
    transform: rotate(90deg)
}

.footer {
    background: #edecec;
    overflow: hidden;
    width: 100%
}

.footer .conBox {
    width: 100%;
    max-width: 1200px;
    margin: auto;
    overflow: hidden;
    padding: 50px 0 30px 0
}

.footer .conBox .nav {
    width: 78%;
    float: left
}

.footer .conBox .nav .botnav {
    width: 100%;
    position: relative;
    font-size: 16px;
    padding: 0px 0 25px 0;
    overflow: hidden
}

.footer .conBox .nav .botnav a {
    color: #444;
    width: 20%;
    float: left;
    display: block;
    padding: 0 10px;
    font-weight: bold;
    font-size: 17px;
    text-transform: uppercase
}

.footer .conBox .nav .botsub_nav {
    width: 100%;
    overflow: hidden
}

.footer .conBox .nav .botsub_nav .item {
    float: left;
    line-height: 28px;
    width: 20%;
    float: left;
    padding: 0 15px
}

.footer .conBox .nav .botsub_nav .item a {
    color: #444;
    display: block;
    font-size: 16px;
    font-weight: 400;
}

.footer .conBox .nav .botsub_nav .info {
    text-align: left;
    width: 150px;
    color: #737172;
    padding: 10px 0 0 20px
}

.footer .conBox .nav .botsub_nav .info h2 {
    color: #444;
    font-size: 20px
}

.footer .conBox .nav .botsub_nav .info p {
    display: block;
    color: #D8BB99
}

.footer .conBox .nav .botsub_nav .info p img {
    padding: 5px 5px 0 0
}

.footer .conBox .info {
    width: 215px;
    float: right
}

.footer .conBox .info .kefu {
    display: inline-block;
    border: 1px solid #c9c9c9;
    padding: 12px 49px;
    color: #000000;
    font-size: 15px;
    transition: .8s;
}

.footer .conBox .info .kefu:hover {
    background: #b28a4c;
    color: #fff
}

.footer .conBox .info span {
    display: inline-block;
    color: #474646;
    font-weight: 900;
    font-size: 16px;
    padding: 8px 0 5px 0;
}

.footer .conBox .info h2 {
    display: inline-block;
    color: #474646;
    font-size: 25px;
    padding-bottom: 0;
}

.footer .conBox .info .qrcode img {
   width:100%;

}
.footer .conBox .info .qrcode .ov_img{
    width:50%;
    float:left;
    padding:10px;
    padding-left:0
}

.footer .botBox {
    background: #434343;
    padding: 10px 0 10px 0;
    color: #fff
}

.footer .botBox a {
    color: #fff;
    font-size: 14px;
    padding: 0 5px;
}

.footer .botBox .logo {
    border-bottom: 1px solid #535353;
    padding: 20px 0;
    text-align: center
}

.footer .botBox p {
    width: 1200px;
    margin: auto;
    padding: 20px 0;
    line-height: 28px;
    font-size: 14px;
    text-transform: uppercase
}

.footer .botBox .link {
    line-height: 25px
}

.jisa-waiter {
    position: fixed;
    right: 0px;
    bottom: 10%;
    margin-top: -90px;
    width: 60px;
    box-shadow: 0px 0px 20px rgba(0, 0, 0, 0.3);
    z-index: 999
}

.waiter-ul li {
    position: relative;
    height: 60px;
    line-height: 60px;
    border-bottom: 1px solid #fff;
    margin-bottom: 1px;
}

.waiter-ul li a {
    position: absolute;
    left: 0;
    top: 0;
    z-index: 2;
    color: #fff;
    display: block;
    width: 60px;
    height: 60px;
    line-height: 60px;
    text-align: center;
    -webkit-transition: all 0.6s;
    -ms-transition: all 0.6s;
    -moz-transition: all 0.6s;
    text-decoration: none;
    font-size: 24px
}

.waiter-ul li:hover .waiter-title {
    left: -127px;
    opacity: 1
}

.waiter-ul li.jisa-contact a {background: #23455b;}

.waiter-ul li.jisa-contact .waiter-title {
    background-color: #23455b;
}

.waiter-ul li.jisa-contact .waiter-title:before {
    background-color: #23455b
}

.waiter-ul li.jisa-kefu a {
    font-size: 35px;
    background: #23455b;
    border-bottom: 1px solid #ccc;
    margin-top: 1px;
}

.waiter-ul li.jisa-kefu .waiter-title {
   background-color: #23455b;
}

.waiter-ul li.jisa-kefu .waiter-title:before {
    background-color: #23455b;
}

.waiter-ul li.jisa-top a {background: #23455b;}

.waiter-ul li.jisa-top .waiter-title {
   background-color: #23455b;
}

.waiter-ul li.jisa-top .waiter-title:before {
   background-color: #23455b;
}

.waiter-title {
    position: absolute;
    left: 0px;
    bottom: 1px;
    color: #fff;
    width: 120px;
    height: 46px;
    line-height: 46px;
    text-align: center;
    -webkit-transition: all 0.6s;
    -ms-transition: all 0.6s;
    -moz-transition: all 0.6s;
    background-color: #fff;
    box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.3);
    z-index: 1;
    opacity: 0;
}

.waiter-title:before {
    content: '';
    display: block;
    width: 10px;
    height: 10px;
    position: absolute;
    right: -5px;
    top: 14px;
    background-color: #fff;
    transform: rotate(45deg)
}

.paged a, .paged span, .paged .p_info, .paged .current {
    border: 1px solid #ccc;
    display: inline-block;
    zoom: 1;
    *display: inline;
    margin: 0px 3px;
    padding: 13px 19px;
    font-size: 14px;
    text-align: center;
    background: #FFF;
    color: #555
}

.paged .current, .paged a:hover {
    background: #23455b;
    color: #FFF
}

.paged .one {
    padding-left: 54px;
    padding-right: 54px
}

.banner {
    height: 100%!important;
}
.banner img{
    width:100%
}
.banner .swiper-slide {
    background: #000;
    height: 100%
}

.banner .swiper-slide .wrap {
    width: 100%;
    height: 100%;
    position: relative;
    margin: 0 auto
}

.banner .swiper-slide .s1 .txt {
    width: 450px;
    height: 180px;
    position: absolute;
    top: 50%;
    left: 10%;
    width: 30%;
    transition: all 1s ease-out;
    opacity: 0;
    transform: translate(-20px, 20px);
    transform: scale(0.8);
    z-index: 2
}

.banner .swiper-slide video {
    width: 100%
}

.banner .swiper-slide-active .s1 .txt {
    opacity: 1;
    margin: 0;
    transform: translate(0, 0);
    transform: scale(1)
}

.banner .swiper-pagination {
    position: absolute;
    left: 0;
    right: 0;
    bottom: 18px;
    width: 100%;
    *padding-left: 46%;
    text-align: center;
    z-index: 11
}

.banner .swiper-pagination li {
    display: inline-block;
    background: none;
    *display: inline;
    *float: left;
    width: 32px;
    height: 32px;
    margin: 0 2px;
    cursor: pointer;
    opacity: 0.5;
    color: #fff;
    position: relative
}

.banner .swiper-pagination li.swiper-pagination-bullet-active {
    opacity: 1
}

.banner .swiper-pagination li.swiper-pagination-bullet-active i {
    background: #b28a4c
}

.banner .swiper-pagination li i {
    width: 100%;
    height: 2px;
    background: none;
    position: absolute;
    left: 0;
    bottom: 0;
    display: block
}

#home .fp_content {
    width: 100%;
    height: 100%
}

#home .iactivityBox {
    background-color: #fff;
    height: 42px;
    overflow: hidden;
    color: #252525;
    position: relative
}

#home .activityBtn {
    position: absolute;
    right: 0px;
    width: 30%;
    height: 42px;
    background-color: #23455b;
    color: #fff;
    padding-left: 70px;
    bottom: 0px;
    line-height: 42px;
}

#home .iactivityBox .inner {
    padding-left: 38px;
    height: 42px;
    overflow: hidden;
    width: 972px;
    margin: 0
}

#home .iactivityBox .inner a {
    color: #252525
}

#home .activityBtn span {
    padding-left: 8px;
    transition: all 0.3s ease 0s;
    -webkit-transform: all 0.3s ease 0s
}

#home .activityBtn:hover span {
    padding-left: 15px
}

#home .iactivityBox ul li {
    height: 42px;
    line-height: 42px
}

#home .iactivityBox li .time {
    padding-right: 14px
}

#home .iporoductBox {
    position: relative;
    overflow: hidden;
    width: 100%
}

#home .iproductNav a:link, #home .iproductNav a:visited {
    color: #666
}

#home .iproductNav a:active, #home .iproductNav a:hover {
    color: #fff
}

#home .iproductNav {
    position: absolute;
    right: 120px;
    bottom: 10%;
    z-index: 2;
}

#home .iproductNav ul {
    float: right;
    display: block
}

#home .iproductNav li {
    width: 85px;
    margin-left: 32px;
    height: 85px;
    float: left;
}

#home .iproductNav li a {
    display: block;
    width: 90px;
    height: 90px;
    padding-top: 8px;
    text-align: center;
    position: relative;
    display: block;
    margin: 0px auto;
}

#home .iproductNav .y1 {
    width: 100%;
    height: 100%;
    border-radius: 50%;
    background-color: #ffffff;
    display: block;
    position: absolute;
    left: 0px;
    top: 0px;
    transition: all 0.5s ease 0s;
    -webkit-transform: all 0.5s ease 0s
}

#home .iproductNav .y2 {
    width: 100%;
    height: 100%;
    border-radius: 50%;
    background-color: #23455b;
    display: block;
    position: absolute;
    left: 0px;
    top: 0px;
    transform: scale(0.6);
    -webkit-transform: scale(0.6);
    opacity: 0;
    -moz-transition: all 0.6s cubic-bezier(0.445, 0.145, 0.355, 1);
    -o-transition: all 0.6s cubic-bezier(0.445, 0.145, 0.355, 1);
    -ms-transition: all 0.6s cubic-bezier(0.445, 1.045, 0.355, 1);
    transition: all 0.6s cubic-bezier(0.445, 0.145, 0.355, 1);
    visibility: hidden
}

#home .iproductNav .ico {
    position: relative;
       background-size: 100%!Important;
    width: 30px;
    height: 38px;
    margin: 7px auto;
    display: block;
    z-index: 2;
    background-size: auto 100%;
    background-repeat: no-repeat;
    background-position: center center;
}

#home .iproductNav .i2 {
    opacity: 0;
    display: none
}

#home .iproductNav .name {
    position: relative;
    z-index: 2;
    font-size: 12px
}

#home .iproductNav a:hover, #home .iproductNav a.active {
    color: #fff
}

#home .iproductNav a:hover .i1, #home .iproductNav a.active .i1 {
    opacity: 0;
    display: none
}

#home .iproductNav a:hover .i2, #home .iproductNav a.active .i2 {
    opacity: 1;
    display: block
}

#home .iproductNav a:hover .y1, #home .iproductNav a.active .y1 {
    opacity: 0;
    transform: scale(1.3);
    -webkit-transform: scale(1.3)
}

#home .iproductNav a:hover .y2, #home .iproductNav a.active .y2 {
    transform: scale(1);
    -webkit-transform: scale(1);
    opacity: 1;
    visibility: visible
}

#home .iporoductDemo {
    position: relative;
    overflow: hidden;
    height: 100%
}

#home .iporoductDemo a {
    color: #fff
}

#home .iporoductDemo .item {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    overflow: hidden;
    opacity: 0;
    transition: all 1s ease;
    transform: translateX(80px);
    -webkit-transform: translateX(80px);
    transition: 1s;
    -webkit-transition: 1s
}

#home .iporoductDemo .ipimg {
    height: 100%;
    display: block;
}

#home .iporoductDemo .inner {
    position: absolute;
    right:	120px;
    margin-left: -505px;
    bottom: 50px;
}

#home .iporoductDemo .ipCon {
    width: 530px;
    background: url(../images/red_bg2.png) repeat;
    background: no-repeat #23455bb5;
    transition: 1s;
    -webkit-transition: 1s;
    opacity: 0;
}

#home .iporoductDemo .ipCon .zh {
    font-size: 24px
}

#home .iporoductDemo .ipCon .en {
    color: #ffa9a5;
    font: 30px/1.4 "acaslonpro", "times new roman", tahoma, georgia
}

#home .iporoductDemo .ipCon .c {
    margin: 30px 0px 20px
}

#home .iporoductDemo .ipCon .ppbing {
    padding: 5% 8% 6%;
    color: #fff;
    font-size: 14px;
    line-height: 1.5;
}

#home .iporoductDemo .item.active {
    transform: translateX(0);
    -webkit-transform: translateX(0);
    opacity: 1
}

#home .iporoductDemo .item.active .ipCon {
    opacity: 1
}

#home .ipmore {
    padding: 0px 8%;
    display: block;
    height: 36px;
    line-height: 36px;
    background: #11222d;
    font-size: 14px;
}

#home .ipmore span {
    padding-left: 10px;
    transition: 300ms;
    -webkit-transition: 300ms
}

#home .ipmore:hover {
    background: #23455b
}

#home .ipmore:hover span {
    padding-left: 15px
}

#home .criteriaBox .title {
    text-align: center;
    padding: 55px 0
}

#home .criteriaBox .title h2.en {
    font-size: 24px;
    color: #b28a4c;
    text-transform: uppercase;
    font-weight: normal;
    padding: 0
}

#home .criteriaBox .title h2.cn {
    color: #313131;
    font-size: 30px;
    padding: 15px 0
}
.xilie{
    overflow:hidden;
    padding: 10px;
    padding-bottom: 0;
}
.xilie li{
    width: 50%;
    overflow: hidden;
    float: left;
    position: relative;
    height: 462px;
}
.xilie li .mask{
    
display: block;
    
background: #000;
    
position: absolute;
    
z-index: 888;
    
width: 100%;
    
height: 100%;
    
opacity: 0.5;
    
transition: all 1s;
}
.xilie li:hover .mask{
    opacity: 0.1;
}
.xilie li .ov_img img{
      transition: all 1s;
}
.xilie li:hover .ov_img img{
      transform:scale(1.1);
}
.xilie li a{display: block;}
.tt{
}
.xilie  .ov_img{}
.xilie li a img{
    display: block;
}
.xilie li a .tt{
    position: absolute;
    bottom: 57px;
    left: 52px;
    z-index: 888;
    color: #fff;
    font-size: 30px;
}
.xilie li a .tt:after{
    content:'';
    width: 75px;
    height: 2px;
    display: block;
    background: #fff;
    margin-top: 12px;
}


#home .criteriaBox .title .line {
    width: 100px;
    height: 2px;
    background: #b28a4c;
    margin: auto
}

#home .criteriaBox .title h3 {
    font-size: 18px;
    padding-top: 15px;
    font-weight: normal
}

#home .criteriaBox .cd-slider {
    position: relative;
    z-index: 1;
    height: 500px;
    overflow: hidden;
}

#home .criteriaBox .cd-slider li {
    position: absolute;
    top: 0;
    left: 0;
    height: 100%;
    width: 100%;
    text-align: center;
    -webkit-transform: translateX(100%);
    -moz-transform: translateX(100%);
    -ms-transform: translateX(100%);
    -o-transform: translateX(100%);
    transform: translateX(100%);
    -webkit-transition: -webkit-transform .6s;
    -moz-transition: -moz-transform .6s;
    transition: transform .6s
}

#home .criteriaBox .cd-slider li:nth-child(2) .content {
    background:#4b4b4b;
}

#home .criteriaBox .cd-slider li:nth-child(3) .content {
    background: #4b4b4b;
}

#home .criteriaBox .cd-slider li:nth-child(4) .content {
    background:#4b4b4b;
}

#home .criteriaBox .cd-slider li.is-visible {
    -webkit-transform: translateX(0);
    -moz-transform: translateX(0);
    -ms-transform: translateX(0);
    -o-transform: translateX(0);
    transform: translateX(0)
}

#home .criteriaBox .cd-slider .cd-half-block {
    height: 100%;
    width: 50%;
    float: right;
    background-position: center center;
    background-repeat: no-repeat
}

#home .criteriaBox .cd-slider .image {
    background-size: cover
}

#home .criteriaBox .cd-slider .content {
    padding: 30px;
    color: #434343;
    font-size: 14px;
    background-color: #4b4b4b;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    line-height: 30px
}

#home .criteriaBox .cd-slider .text-con {
    padding: 0 140px;
    margin: auto;
    text-align: left;
    margin-top:140px;
}

#home .criteriaBox .cd-slider .text-con .icon {
    width: 100%;
    padding: 50px 0 30px 0
}

#home .criteriaBox .cd-slider .text-con h2 {
    width: 100%;
    font-weight: bold;
    font-size: 30px;
    text-transform: uppercase;
    margin: 0 auto 1.4rem auto;
    line-height: 40px;
    color: #fff;
}

#home .criteriaBox .cd-slider .text-con .remark {
    width: 100%;
    color: #ededed;
    margin: auto;
    line-height: 30px;
    font-size: 21px;
}
#home .criteriaBox .cd-slider .text-con .remark strong{
    color:#fff;
    margin: 0 3px;
    font-size: 25px;
}

#home .criteriaBox .changeBtn {
    position: absolute;
    bottom: 50px;
    padding: 0 150px;
    left: 0;
    z-index: 10
}

#home .criteriaBox .changeBtn .btns {
    width: 20px;
    height: 31px;
    transition: .4s;
    -webkit-transition: .4s;
    cursor: pointer;
    float: left;
    background: url(../images/indubtn.png) no-repeat
}

#home .criteriaBox .changeBtn .btns.btnL {
    background-position: left center;
    margin-top: 14%
}

#home .criteriaBox .changeBtn .btns.btnL:hover {
    background-image: url(../images/indubtn2.png);
    transform: translateX(-5px)
}

#home .criteriaBox .changeBtn .btns.btnR {
    background-position: right center;
    margin-top: 14%
}

#home .criteriaBox .changeBtn .btns.btnR:hover {
    background-image: url(../images/indubtn2.png);
    transform: translateX(5px)
}

#home .criteriaBox .changeBtn .page {
    float: left;
    line-height: 65px;
    color: #fff;
    width: auto;
    background: 0;
    font-size: 26px
}

#home .criteriaBox .changeBtn .page .pageActive {
    font-size: 50px;
    margin-right: 5px
}

#home .criteriaBox .changeBtn .page .allPage {
    font-size: 28px;
    margin-left: 5px
}

#home .technologyBox {
    height: 700px;
    position: relative;
}

#home .technologyBox .contBox {
    background: #242222;
    height: 100%;
    position: relative;
    overflow: hidden
}

#home .technologyBox .contBox .leftBox {
    position: absolute;
    left: 0
}

#home .technologyBox .contBox .leftBox .title {
    padding-top: 40px
}

#home .technologyBox .contBox .leftBox .list {
    margin-top: 15px;
    width: 100%
}

#home .technologyBox .contBox .leftBox .list li {
    display: none
}

#home .technologyBox .contBox .leftBox .list li:first-child {
    display: block
}

#home .technologyBox .contBox .leftBox .list h2 {
    font-size: 32px;
    color: #b28a4c;
    margin-top: 10px;
}

#home .technologyBox .contBox .leftBox .list p {
    font-size: 16px;
    color: #fff;
    line-height: 29px;
}

#home .technologyBox .contBox .leftBox .list span {
    display: block;
    font-size: 18px;
    color: #b28a4c;
    padding: 10px 0
}

#home .technologyBox .contBox .leftBox .list .tb {
    display: flex;
    flex-wrap: wrap;
    width: 630px
}

#home .technologyBox .contBox .leftBox .list .tb .item {
    font-size: 17px;
    color: #fff;
    background: #b28a4c;
    margin: 0 1%;
    padding: 10px;
    text-align: center
}

#home .technologyBox .contBox .leftBox .list .tb .item:nth-child(2) {
    background: #75b433
}

#home .technologyBox .contBox .leftBox .list .tb .item:nth-child(3) {
    background: #604a7b
}

#home .technologyBox .contBox .rightBox {
    float: right;
    width: 50%;
    right: 0;
    top: 0;
    bottom: 0;
    position: absolute
}

#home .technologyBox .contBox .rightBox .image {
    width: 100%;
    height: 100%;
    background-size: cover;
    background-position: top right
}

#home .technologyBox .iconBox {
    width: 100%;
    position: absolute;
    z-index: 10;
    height: 214px;
    bottom: 0;
    text-align: center;
    background: rgba(255, 255, 255, 0.8);
    background: -webkit-linear-gradient(left, rgba(255, 255, 255, 0), rgba(255, 255, 255, 0.8), rgba(255, 255, 255, 0));
    background: -o-linear-gradient(right, rgba(255, 255, 255, 0), rgba(255, 255, 255, 0.8), rgba(255, 255, 255, 0));
    background: -moz-linear-gradient(right, rgba(255, 255, 255, 0), rgba(255, 255, 255, 0.8), rgba(255, 255, 255, 0));
    background: linear-gradient(to right, rgba(255, 255, 255, 0), rgba(255, 255, 255, 0.8), rgba(255, 255, 255, 0))
}

#home .technologyBox .iconBox ul {
    display: inline-block;
    overflow: hidden;
    height: 100%
}

#home .technologyBox .iconBox ul li {
    cursor: pointer;
    transition-duration: .5s;
    -webkit-transition-duration: .5s;
    float: left;
    width: 11.11111%;
    height: 100%;
    float: left
}

#home .technologyBox .iconBox ul li .icon {
    width: 52px;
    position: relative;
    top: 0;
    height: 52px;
    text-align: center;
    background: url(../images/joinicon1.png) no-repeat;
    border-radius: 50%;
    margin: 38px auto 31px;
    position: relative;
    top: 0;
    transition-duration: .5s;
    -webkit-transition-duration: .5s;
    border: 1px solid transparent
}

#home .technologyBox .iconBox ul li .icon.icon1 {
    background-position: 13px center
}

#home .technologyBox .iconBox ul li .icon.icon2 {
    background-position: -36px center
}

#home .technologyBox .iconBox ul li .icon.icon3 {
    background-position: -85px center
}

#home .technologyBox .iconBox ul li .icon.icon4 {
    background-position: -136px center
}

#home .technologyBox .iconBox ul li .icon.icon5 {
    background-position: -183px center
}

#home .technologyBox .iconBox ul li .icon.icon6 {
    background-position: -232px center
}

#home .technologyBox .iconBox ul li .icon.icon7 {
    background-position: -281px center
}

#home .technologyBox .iconBox ul li .icon.icon8 {
    background-position: -325px center
}

#home .technologyBox .iconBox ul li .icon.icon9 {
    background-position: -374px center
}

#home .technologyBox .iconBox ul li .text {
    color: #535353;
    font-size: 14px;
    position: relative;
    top: 0
}

#home .technologyBox .iconBox ul li .en {
    font-size: 12px;
    text-transform: uppercase;
    line-height: 40px
}

#home .technologyBox .iconBox ul li.active, #home .technologyBox .iconBox ul li:hover {
    background: #b28a4c
}

#home .technologyBox .iconBox ul li.active .icon, #home .technologyBox .iconBox ul li:hover .icon {
    background-image: url(../images/joinicon2.png);
    top: -5px;
    border: 1px solid #fff
}

#home .technologyBox .iconBox ul li.active .text, #home .technologyBox .iconBox ul li:hover .text {
    font-size: 16px;
    color: #fff;
    top: 5px
}

#home .technologyBox .iconBox ul li.active .en, #home .technologyBox .iconBox ul li:hover .en {
    font-size: 14px
}


#home .aboutBox {
    background: #6a6a6a url(../images/about_bg.jpg) center top fixed no-repeat;
    padding: 0px 0 92px;
    margin: 30px 0 0 0
}

#home .aboutBox .about {
    margin-bottom: 95px
}

#home .aboutBox .aboutle {
    float: left;
    padding-left: 20px;
    width: 240px;
    padding-top: 30px;
    margin-top: 7px;
    padding-bottom: 25px;
    padding-right: 0px;
    position: relative;
}

#home .aboutBox .aboutle:before {
    content: "";
    width: 100%;
    height: 100%;
    position: absolute;
    left: 0;
    top: 0;
    background: #23455b;
}

#home .aboutBox .aboutle span {
    display: block;
    line-height: 1;
    color: #ffffff;
    font-size: 24px;
    margin-bottom: 23px;
    position: relative;
    font-weight: 800;
}

#home .aboutBox .aboutle strong {
    position: relative;
    display: block;
    color: #fff;
    font-size: 22px;
    line-height: 1.4;
    font-weight: normal;
    margin-bottom: 10px;
}

#home .aboutBox .aboutle i {
    display: block;
    width: 13px;
    height: 13px;
    position: absolute;
    left: 26px;
    bottom: 26px;
    transition: 0.36s transform
}

#home .aboutBox .aboutle:hover i {
    transform: rotate(180deg);
    -webkit-transform: rotate(180deg);
    -moz-transform: rotate(180deg)
}

#home .aboutBox .aboutle small {
    display: block;
    color: #ffffff;
    font-size: 36px;
    font-family: "Conv_HelveticaNeueLT-CondensedObl";
    position: absolute;
    right: 26px;
    bottom: 26px;
    line-height: 1;
    display: none
}

#home .aboutBox .modern {
    width: 814px;
    float: right;
    margin-right: -213px;
    position: relative
}

#home .aboutBox .modern:before {
    content: "";
    width: 100%;
    height: 100%;
    position: absolute;
    left: 0;
    top: 0;
    /* background: url(../images/bg1.png) repeat; */
}

#home .aboutBox .modern .modermore {
    display: block;
    width: 51px;
    height: 47px;
    position: absolute;
    left: -51px;
    bottom: 0;
    background: #b28a4c;
}

#home .aboutBox .modern .modermore:before {
    content: "";
    width: 9px;
    height: 9px;
    background: url(../images/more_i2.png) center no-repeat;
    position: absolute;
    left: 21px;
    top: 19px;
    transition: 0.34s
}

#home .aboutBox .modern .modermore:hover:before {
    transform: rotate(180deg);
    -webkit-transform: rotate(180deg);
    -moz-transform: rotate(180deg)
}

#home .aboutBox .modern .modernfix {
    padding: 28px 60px 35px 30px;
    position: relative;
    background: #ffffffb3;
}

#home .aboutBox .modern .modernfix .wood {
    float: left
}

#home .aboutBox .modern .modernfix .wood small {
    display: block;
    color: #645f64;
    font-size: 50px;
    line-height: 70px;
    margin-bottom: 10px;
    font-family: "Conv_HelveticaNeueLT-CondensedObl"
}

#home .aboutBox .modern .modernfix .wood p {
    color: #010101;
    font-size: 16px;
    line-height: 1.8
}

#home .aboutBox .modern .modernfix .woodnub {
    float: right;
    padding-left: 130px;
    position: relative
}

#home .aboutBox .modern .modernfix .woodnub:before {
    content: "";
    width: 83px;
    height: 141px;
    position: absolute;
    left: 0;
    top: 0
}

#home .aboutBox .modern .modernfix .woodnub .wood-info {
    margin-bottom: 22px
}

#home .aboutBox .modern .modernfix .woodnub .wood-info p {
    color: #000000;
    font-size: 14px;
    line-height: 1.4
}

#home .aboutBox .modern .modernfix .woodnub .wood-info p b {
    display: inline-block;
    color: #1c2956;
    font-size: 42px;
    margin-right: 30px;
    font-weight: normal;
    font-family: "Conv_HelveticaNeueLT-ThinExt";
    width: 106px
}

#home .aboutBox .procenter {
    position: relative;
    padding-bottom: 49px
}

#home .aboutBox .procenter:before {
    content: "";
    width: 814px;
    position: absolute;
    right: -214px;
    top: 0;
    height: 100%
}

#home .aboutBox .procenter .protops {
    margin-bottom: 39px;
    position: relative;
    z-index: 5
}

#home .aboutBox .procenter .pcentera {
    width: 50%;
    float: left;
    background: url(../images/moderbg.png) repeat
}

#home .aboutBox .procenter .pcentera a {
    display: block;
    padding-left: 25px;
    color: #fff;
    line-height: 76px;
    font-size: 16px;
    font-weight: bold
}

#home .aboutBox .procenter .pcentera a:hover {
    color: #d9241d
}

#home .aboutBox .brand {
    width: 50%;
    float: left;
    position: relative
}

#home .aboutBox .brandsele {
    float: left;
    width: 408px;
    position: relative
}

#home .aboutBox .brandsele span {
    display: block;
    position: relative;
    padding-left: 32px;
    line-height: 76px;
    color: #000000;
    font-size: 16px;
    font-weight: bold;
    cursor: pointer;
    background: #fff
}

#home .aboutBox .brandsele span:before {
    content: "";
    width: 14px;
    height: 7px;
    position: absolute;
    right: 27px;
    top: 50%;
    margin-top: -3px;
    transition: 0.3s
}

#home .aboutBox .brandsele span.now:before {
    transform: rotate(-180deg);
    -webkit-transform: rotate(-180deg);
    -moz-transform: rotate(-180deg)
}

#home .aboutBox .brandown {
    width: 100%;
    position: absolute;
    left: 0;
    top: 76px;
    background: #fff;
    display: none
}

#home .aboutBox .brandown li {
    border-top: 1px solid #aaaaaa
}

#home .aboutBox .brandown li a {
    display: block;
    padding-left: 32px;
    line-height: 54px;
    color: #000000;
    font-size: 14px
}

#home .aboutBox .brandown li a:hover {
    color: #e62129
}

#home .aboutBox .customized {
    float: right;
    border: 4px solid #1c2956;
    width: 68px;
    position: relative;
    overflow: hidden
}

#home .aboutBox .customized:before {
    content: "";
    width: 0%;
    height: 0%;
    position: absolute;
    background: #1c2956;
    position: absolute;
    left: 50%;
    top: 50%;
    border-radius: 50%;
    transform: translate(-50%, -50%);
    -webkit-transform: translate(-50%, -50%);
    -moz-transform: translate(-50%, -50%);
    transition: 0.4s ease-in-out
}

#home .aboutBox .customized a {
    display: block;
    text-align: center;
    padding: 18px 0;
    color: #000;
    font-size: 16px;
    font-weight: bold;
    line-height: 1;
    position: relative;
    background: url(../images/moderbg.png) repeat;
}

#home .aboutBox .customized:hover:hover {
    background: #1c2956\9
}

#home .aboutBox .customized:hover:before {
    width: 150%;
    height: 150%
}

#home .aboutBox .customized:hover a {
    color: #fff
}

#home .aboutBox .prolist li {
    width: 23.33%;
    margin-right: 2.0875%;
    height: 206px;
    float: left;
    position: relative;
    background: url(../images/moderbg.png) repeat;
}

#home .aboutBox .prolist li:before {
    content: "";
    width: 100%;
    height: 100%;
    position: absolute;
    left: 0;
    top: 0;
    background: #ffffff;
    -webkit-transition: -webkit-transform 0.5s cubic-bezier(0.4, 0, 0.2, 1);
    transition: -webkit-transform 0.5s cubic-bezier(0.4, 0, 0.2, 1);
    transition: transform 0.5s cubic-bezier(0.4, 0, 0.2, 1);
    transition: transform 0.5s cubic-bezier(0.4, 0, 0.2, 1), -webkit-transform 0.5s cubic-bezier(0.4, 0, 0.2, 1);
    transform-origin: left 100%;
    -webkit-transform-origin: left 100%;
    transform: scaleY(0);
    -moz-transform: scaleY(0);
    -webkit-transform: scaleY(0);
    visibility: hidden\9
}

#home .aboutBox .prolist li:last-child {
    margin-right: 0
}

#home .aboutBox .prolist li a {
    display: block;
    position: relative;
    padding-top: 50px;
    height: 160px;
    text-align: center
}

#home .aboutBox .proicon {
    width: 63px;
    height: 56px;
    margin: auto;
    position: relative;
    margin-bottom: 24px;
    overflow: hidden
}

#home .aboutBox .proicon img {
    display: block;
    max-width: 100%;
    max-height: 100%;
    position: absolute;
    left: 0;
    top: 0;
    right: 0;
    bottom: 0;
    margin: auto;
    transition: 0.54s
}

#home .aboutBox .proicon img.prohide {
    opacity: 0;
    visibility: hidden;
    transform: translateY(100%);
    -webkit-transform: translateY(100%);
    -moz-transform: translateY(100%)
}

#home .aboutBox .prolist li span {
    display: block;
    text-align: center;
    line-height: 1;
    color: #ffffff;
    font-size: 16px;
    transition: 0.36s
}

#home .aboutBox .promore {
    margin-top: 29px;
    position: relative;
    margin-left: 21px;
    margin-right: 20px
}

#home .aboutBox .promore i {
    display: block;
    width: 81%;
    width: 0;
    height: 1px;
    background: #00b2d2;
    position: relative;
    margin-top: 9px;
    float: left;
    transition: 0.35s
}

#home .aboutBox .promore i:before {
    content: "";
    width: 5px;
    height: 5px;
    background: #e7222a;
    border-radius: 50%;
    position: absolute;
    left: 0;
    top: -2px;
    opacity: 0;
    visibility: hidden;
    transition: 0.34s
}

#home .aboutBox .promore b {
    display: block;
    width: 18px;
    height: 18px;
    float: right;
    opacity: 0;
    visibility: hidden;
    transition: 0.34s
}

#home .aboutBox .prolist li:hover:before {
    transform: scaleY(1);
    -webkit-transform: scaleY(1);
    transform-origin: left 0;
    -webkit-transform-origin: left 0;
    visibility: visible\9
}

#home .aboutBox .prolist li:hover .proicon img.proshow {
    opacity: 0;
    visibility: hidden;
    transform: translateY(-100%);
    -webkit-transform: translateY(-100%);
    -moz-transform: translateY(-100%)
}

#home .aboutBox .prolist li:hover .proicon img.prohide {
    opacity: 1;
    visibility: visible;
    transform: translateY(0);
    -webkit-transform: translateY(0);
    -moz-transform: translateY(0)
}

#home .aboutBox .prolist li:hover span {
    color: #323232
}

#home .aboutBox .prolist li:hover .promore i {
    width: 81%;
    transition: 0.48s 0.2s ease-in-out
}

#home .aboutBox .prolist li:hover .promore i:before {
    opacity: 1;
    visibility: hidden;
    transition: 0.34s 0.3s
}

#home .aboutBox .prolist li:hover .promore b {
    opacity: 1;
    visibility: visible;
    transform: rotate(180deg);
    -webkit-transform: rotate(180deg);
    transition: 0.35s 0.4s ease-in-out
}
#home .newsBox {
    padding: 50px 0 0 0
}

#home .newsBox .conBox {
    height: 616px;
    position: relative;
    width: 96%;
    margin: 0 auto;
    min-width: 1720px;
}

#home .newsBox .conBox .leftBox {
    float: left;
    width: 50%;
    height: 100%;
    padding-left: 2.5%;
    overflow: hidden;
}

#home .newsBox .conBox .leftBox .image {
    width: 100%;
    height: 100%;
    background-size: cover;
    background-position: top right
}

#home .newsBox .conBox .rightBox {
    position: absolute;
    right: 0;
    width: 45%
}

#home .newsBox .conBox .rightBox .title h3 {
    font-size: 24px;
    color: #b28a4c;
    font-weight: normal
}

#home .newsBox .conBox .rightBox .title h2 {
    font-size: 30px
}

#home .newsBox .conBox .rightBox .title .line {
    width: 30px;
    height: 3px;
    background: #b28a4c;
    margin-top: 10px
}

#home .newsBox .conBox .rightBox .arrow {
    position: absolute;
    right: 0;
    top: 20px
}

#home .newsBox .conBox .rightBox .arrow a {
    display: block;
    width: 50px;
    height: 50px;
    padding: 3px;
    text-align: center;
    border: 2px solid #bfbfbf;
    border-radius: 50px;
    float: left;
    margin: 0 5px;
    transition: all .5s ease-in
}

#home .newsBox .conBox .rightBox .arrow span {
    font-size: 38px;
    transition: all .5s ease-in
}

#home .newsBox .conBox .rightBox .arrow a:hover {
    border: 2px solid #b28a4c
}

#home .newsBox .conBox .rightBox .arrow a:hover span {
    color: #b28a4c
}

#home .newsBox .conBox .rightBox .list {
    height: 535px;
    overflow: hidden
}

#home .newsBox .conBox .rightBox .list li {
    padding: 33px 0;
    overflow: hidden
}

#home .newsBox .conBox .rightBox .list li .time {
    width: 100px;
    padding: 5px 0;
    border: 2px solid #040404;
    color: #040404;
    text-align: center;
    float: left
}

#home .newsBox .conBox .rightBox .list li .time h2 {
    font-size: 62px;
    font-weight: normal
}

#home .newsBox .conBox .rightBox .list li .time span {
    font-size: 16px;
    text-align: center
}

#home .newsBox .conBox .rightBox .list li .text {
    width: 80%;
    float: right;
    color: #040404;
    transition: all .5s
}

#home .newsBox .conBox .rightBox .list li .text h2 {
    font-size: 20px;
    padding: 0 0 10px 0
}

#home .newsBox .conBox .rightBox .list li .text p {
    font-size: 14px;
    color: #6e6e6e;
    line-height: 22px
}

#home .newsBox .conBox .rightBox .list li a:hover .text {
    color: #b28a4c
}

#home .newsBox .listBox {
    margin-top: 45px;
    width: 100%;
    background: #f2f3f3
}

#home .newsBox .listBox .con {
    width: 96%;
    max-width: 1720px;
    margin: auto;
    height: 420px;
    overflow: hidden
}

#home .newsBox .listBox .con a {
    display: block;
    width: 18%;
    background: #fff;
    border: 1px solid #dcdcdc;
    padding: 20px;
    margin: 25px 1%;
    float: left;
    height: 325px;
    transition: all .8s ease-in-out
}

#home .newsBox .listBox .con a h2 {
    font-size: 15px;
    color: #464545;
    font-weight: normal;
    padding-bottom: 20px;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis
}

#home .newsBox .listBox .con a img {
    /* height: 210px; */
    width: 100%;
}

#home .newsBox .listBox .con a .pic {
    overflow: hidden;
    height: 163px;
    /* border: #ccc 1px solid; */
    display: flex;
    align-items: center;
    justify-content: center;
    align-content: center;
}

#home .newsBox .listBox .con a p {
    font-size: 12px;
    color: #6e6e6e;
    padding: 15px 0;
    line-height: 20px
}

#home .newsBox .listBox .con a span {
    color: #6e6e6e
}

#home .newsBox .listBox .con a .bt .ico {
    width: 50px;
    float: left;
    background: red
}

#home .newsBox .listBox .con a .bt .t {
    float: right
}

#home .newsBox .listBox .con a:hover {
    box-shadow: 1px 4px 10px 2px #CCC
}

#home .joinBox {
    height: 530px;
    background: url(../images/join_bg.jpg) no-repeat;
    background-size: cover;
    margin: 30px auto 0 auto;
    position: relative;
}

#home .joinBox .conBox {
    color: #fff
}

#home .joinBox .conBox .title h2 {
    font-size: 53px;
    text-align: center;
    padding: 45px 0 7px 0;
    line-height: 80px;
    letter-spacing: 6px;
}

#home .joinBox .conBox .form {
    width: 660px;
    margin: auto
}

#home .joinBox .conBox .form .remark {
    font-size: 20px;
    color: #fff;
    display: inline-block;
    vertical-align: center;
}

#home .joinBox .conBox .form .remark i {
    font-size: 39px;
    color: #b28a4c;
    font-style: normal;
}

#home .joinBox .conBox .form .input {
    width: 425px;
    display: inline-block;
    vertical-align: top
}

#home .joinBox .conBox .form .input input {
    border: none;
    width: 190px;
    height: 25px;
    line-height: 25px;
    float: left;
    font-size: 14px;
    margin: 5px 10px;
    padding: 15px
}

#home .joinBox .conBox .form .btn {
    display: inline-block;
    vertical-align: top;
    width: 130px;
    height: 68px;
    margin: 6px 0;
    background: #b28a4c;
    text-align: center;
    line-height: 64px;
    font-size: 18px;
    color: #ffffff;
    border: none;
    border-radius: 4px;
}

.innerBanner {
    position: relative
}

.innerBanner .bg img {
    width: 100%
}

.innerBanner .nav {
    width: 1000px;
    height: 62px;
    background: url(../images/bg2.png);
    position: absolute;
    top: 69%;
    left: 50%;
    text-align: center;
    margin: -31px 0 0 -500px;
    padding: 0 60px;
    border-radius: 50px;
    overflow: hidden
}

.innerBanner .nav a {
    display: inline-block;
    color: #5f5f5f;
    font-size: 16px;
    line-height: 62px;
    padding: 0 30px;
    transition: all .8s ease-in-out
}

.innerBanner .nav a:hover {
    background: url(../images/icon2.png) left center no-repeat
}

.innerBanner .icon {
    position: absolute;
    bottom: 5%;
    left: 0;
    text-align: center;
    width: 100%
}

#about .inner {
    position: relative
}

#about .title {
    text-align: center;
    color: #121212;
    padding: 52px 0 10px 0
}

#about .title h2 {
    font-size: 25px;
    font-weight: normal;
    line-height: 35px
}

#about .title p {
    font-size: 16px;
    line-height: 30px
}

#about .company .text-con .l {
    width: 20%;
    padding: 30px 0 0 0
}

#about .company .text-con .l .tit .en {
    color: #b28a4c;
    font-size: 16px;
    text-transform: uppercase
}

#about .company .text-con .l .tit .ch {
    font-size: 30px
}

#about .company .text-con .l .tit .line {
    width: 50px;
    height: 2px;
    background: #b28a4c;
    margin: 20px 0 0 0
}

#about .company .text-con .r {
    width: 68%
}

#about .company .text-con .r h2 {
    font-size: 24px;
    color: #121212;
    padding: 20px 0;
    font-weight: normal;
    padding-bottom: 10px
}

#about .company .text-con .r h2 i {
    display: inline-block;
    width: 10px;
    height: 10px;
    background: #ffdd11;
    margin: 0 10px
}

#about .company .text-con .r .text {
    font-size: 14px;
    line-height: 26px;
    padding-bottom: 20px
}

#about .company .num {
    display: block;
    clear: left;
    width: 1240px;
    margin: 0 auto;
    margin: 70px 0 0px 0
}

#about .company .num li {
    float: left;
    display: block;
    width: 260px;
    height: 167px;
    margin: 0 25px;
    color: #121212;
    text-align: center
}

#about .company .num li span {
    font-family: "Arial";
    font-size: 60px
}

#about .company .num li p {
    font-size: 14px
}

#about .culture {
    height: 500px;
    position: relative;
    background: url(../images/about02.jpg);
    margin-top: 80px;
    background-position: center bottom;
    background-repeat: no-repeat;
    background-attachment: fixed;
    background-size: cover
}

#about .culture .r {
    width: 305px;
    float: right;
    padding: 40px;
    margin-top: 60px;
    background: url(../images/bg2.png)
}

#about .culture .r h2 {
    color: #1f1e1e;
    padding: 20px 0;
    font-weight: normal;
    padding-bottom: 10px;
    font-size: 16px;
    line-height: 30px
}

#about .culture .r h2 i {
    display: inline-block;
    width: 10px;
    height: 10px;
    background: #ffdd11;
    margin: 0 10px
}

#about .culture .r h2 span {
    font-size: 24px
}

#about .culture .r .text {
    font-size: 14px;
    line-height: 26px;
    padding-bottom: 20px;
    color: #1f1e1e
}

#about .message {
    height: 685px
}

#about .message .l {
    width: 50%;
    padding: 100px
}

#about .message .l .title {
    text-align: left;
    padding: 0px 0 30px 0
}

#about .message .l .title h2.en {
    font-size: 24px;
    color: #b28a4c;
    text-transform: uppercase;
    font-weight: normal;
    padding: 0
}

#about .message .l .title h2.cn {
    color: #313131;
    font-size: 30px;
    padding: 10px 0;
    font-weight: normal
}

#about .message .l .title .line {
    width: 30px;
    height: 4px;
    background: #b28a4c
}

#about .message .l .title h3 {
    font-size: 18px;
    font-weight: normal
}

#about .message .l .text {
    font-size: 14px;
    color: #121212;
    line-height: 25px
}

#about .message .r {
    width: 50%;
    height: 100%;
    background: url(../images/about03.jpg) left center no-repeat
}

#about .videoBox {
    height: 660px;
    background: url(../images/about04.jpg) center center no-repeat;
    text-align: center;
    padding: 90px 0
}

#about .videoBox .videoIcon {
    display: block;
    width: 68px;
    height: 68px;
    border-radius: 68px;
    position: absolute;
    top: 50%;
    left: 50%;
    margin: -34px 0 0 -34px;
    z-index: 2
}

#about .videoBox .videoIcon i {
    display: inline-block;
    width: 0;
    height: 0;
    border-left: 20px solid red;
    border-top: 15px solid transparent;
    border-bottom: 15px solid transparent;
    position: absolute;
    top: 50%;
    left: 50%;
    margin: -15px 0 0 -5px;
    z-index: 2
}

#about .videoBox .videoIcon .y1 {
    width: 100%;
    height: 100%;
    border-radius: 50%;
    background-color: #ffffff;
    display: block;
    position: absolute;
    left: 0px;
    top: 0px;
    transition: all 0.5s ease 0s;
    -webkit-transform: all 0.5s ease 0s
}

#about .videoBox .videoIcon .y2 {
    width: 100%;
    height: 100%;
    border-radius: 50%;
    background-color: red;
    display: block;
    position: absolute;
    left: 0px;
    top: 0px;
    transform: scale(0.6);
    -webkit-transform: scale(0.6);
    opacity: 0;
    -moz-transition: all 0.6s cubic-bezier(0.445, 0.145, 0.355, 1);
    -o-transition: all 0.6s cubic-bezier(0.445, 0.145, 0.355, 1);
    -ms-transition: all 0.6s cubic-bezier(0.445, 1.045, 0.355, 1);
    transition: all 0.6s cubic-bezier(0.445, 0.145, 0.355, 1);
    visibility: hidden
}

#about .videoBox .videoIcon:hover .y1 {
    opacity: 0;
    transform: scale(1.3);
    -webkit-transform: scale(1.3)
}

#about .videoBox .videoIcon:hover .y2 {
    transform: scale(1);
    -webkit-transform: scale(1);
    opacity: 1;
    visibility: visible
}

#about .videoBox .videoIcon:hover i {
    border-left: 20px solid #fff
}

#about .videoBox .video {
    width: 880px;
    height: 448px;
    background-size: cover;
    margin: auto;
    position: relative;
    overflow: hidden
}

#about .videoBox .video img {
    width: 100%
}

#about .videoBox .video video {
    background: #000;
    display: none
}

#about .historyBox {
    padding: 68px 0px;
    background-color: #f2f3f3
}

#about .historyBox .brandStory {
    position: relative;
    padding: 70px 0px
}

#about .historyBox .brandStory .wrap1200 {
    width: 1100px
}

#about .historyBox .brandStory a:link, #about .historyBox .brandStory a:visited {
    color: #000
}

#about .historyBox .brandStory a:active, #about .historyBox .brandStory a:hover {
    color: #B40000
}

#about .historyBox .brandStory .proces_ico2 {
    background: url(../images/d4.png) no-repeat;
    width: 26px;
    height: 26px;
    position: absolute;
    left: 50%;
    top: -26px;
    margin-left: -13px
}

#about .historyBox .brandStory .proces_line {
    height: 100%;
    position: absolute;
    left: 50%;
    top: 0px;
    width: 1px;
    background-color: #a0a0a0
}

#about .historyBox .brandStory .brandStoryDL {
    position: relative;
    overflow: hidden
}

#about .historyBox .brandStory .brandStoryDL dd {
    padding: 34px 0px;
    position: relative;
    transition: 400ms;
    -webkit-transition: 400ms;
    cursor: pointer
}

#about .historyBox .brandStory .brandStoryDL .img {
    float: left;
    width: 50%;
    display: block
}

#about .historyBox .brandStory .brandStoryDL .imgbox {
    width: 290px;
    margin: 0px auto;
    visibility: hidden;
    opacity: 0;
    transition: 400ms;
    -webkit-transition: 400ms
}

#about .historyBox .brandStory .brandStoryDL .imgbox img {
    width: 100%;
    display: block
}

#about .historyBox .brandStory .brandStoryDL .line {
    width: 228px;
    height: 3px;
    background-color: #a0a0a0;
    position: absolute;
    left: 50%;
    margin-left: -60px;
    top: 79px
}

#about .historyBox .brandStory .brandStoryDL .line i {
    border: 1px solid #a0a0a0;
    width: 18px;
    height: 18px;
    position: absolute;
    left: -14px;
    top: -9px
}

#about .historyBox .brandStory .brandStoryDL .time {
    float: left;
    display: block;
    width: 135px;
    margin-left: 68px;
    color: #000;
    position: relative;
    font: 30px/1.2 "gothic", "microsoft yahei";
    text-align: right;
    transition: 400ms;
    -webkit-transition: 400ms
}

#about .historyBox .brandStory .brandStoryDL .time .zs {
    font: 12px/1.2 "gothic", "microsoft yahei";
    text-transform: uppercase;
    display: block;
    position: absolute;
    right: 0px;
    top: 0px;
    opacity: 0;
    visibility: hidden;
    transition: 400ms;
    -webkit-transition: 400ms
}

#about .historyBox .brandStory .brandStoryDL .con {
    float: left;
    display: block;
    margin-left: 35px;
    width: 215px;
    color: #000
}

#about .historyBox .brandStory .brandStoryDL .con .t {
    font-size: 19px;
    font-weight: bold;
    margin-bottom: 10px;
    transition: 400ms;
    -webkit-transition: 400ms
}

#about .historyBox .brandStory .brandStoryDL dd:nth-child(2n) .img {
    float: right
}

#about .historyBox .brandStory .brandStoryDL dd:nth-child(2n) .line {
    left: auto;
    right: 50%;
    margin: 0px -60px 0px 0px
}

#about .historyBox .brandStory .brandStoryDL dd:nth-child(2n) .line i {
    left: auto;
    right: -14px
}

#about .historyBox .brandStory .brandStoryDL dd:nth-child(2n) .time {
    margin-left: 0px
}

#about .historyBox .brandStory .brandStoryDL dd:hover {
    background-color: #fff
}

#about .historyBox .brandStory .brandStoryDL dd:hover .img {
    height: auto
}

#about .historyBox .brandStory .brandStoryDL dd:hover .imgbox {
    visibility: visible;
    opacity: 1
}

#about .historyBox .brandStory .brandStoryDL dd:hover .line {
    opacity: 0;
    visibility: hidden
}

#about .historyBox .brandStory .brandStoryDL dd:hover .time {
    color: #00afcc;
    font-size: 75px;
    line-height: 1;
    padding-right: 20px
}

#about .historyBox .brandStory .brandStoryDL dd:hover .time .y2 {
    position: relative;
    top: 44px;
    left: -40px
}

#about .historyBox .brandStory .brandStoryDL dd:hover .time .zs {
    opacity: 1;
    visibility: visible;
    color: #000
}

#about .historyBox .brandStory .brandStoryDL dd:hover .con .t {
    font-size: 30px;
    padding-top: 30px
}

#about .historyBox .proces_bot3 {
    background: url(../images/d3.png) no-repeat scroll center top;
    width: 114px;
    display: block;
    margin: 30px auto 0px;
    padding-top: 28px;
    text-align: center;
    color: #000
}

#about .historyBox .proces_bot3:hover {
    color: #00afcc
}

#about .strength .storefrontList {
    width: 960px;
    margin: auto
}

#about .strength .storefrontList .img, #about .strength .storefrontList .img img {
    width: 100%;
    display: block;
    position: relative
}

#about .strength .storefrontList .bg {
    background: url(../images/wi_bg.png) repeat;
    background: none rgba(255, 255, 255, 0.6);
    position: absolute;
    left: 0px;
    top: 0px;
    width: 100%;
    height: 100%;
    opacity: 1;
    visibility: visible
}

#about .strength .storefrontList .item {
    position: relative
}

#about .strength .storefrontList .con {
    position: absolute;
    left: 0px;
    bottom: 0px;
    width: 100%;
    padding: 10px 0;
    color: #fff;
    background: no-repeat rgba(127, 176, 222, 0.62);
    display: none;
    font-size: 16px;
    color: #434343;
    text-align: center
}

#about .strength .storefrontList .slick-list {
    overflow: initial
}

#about .strength .storefrontList .slick-active .bg {
    visibility: hidden;
    opacity: 0
}

#about .strength .storefrontList .slick-active .con {
    display: block
}

#about .strength .storefrontList .slick-arrow {
    width: 48px;
    height: 48px;
    display: block;
    background: #05b7db;
    border-radius: 48px;
    top: 50%;
    margin-top: -24px;
    z-index: 100
}

#about .strength .storefrontList .slick-arrow i {
    background: url(../images/img_ico.png) no-repeat scroll left bottom;
    width: 100%;
    height: 100%;
    margin: 0px auto;
    display: block;
    transition: transform 300ms 0ms;
    -webkit-transition: transform 300ms 0ms
}

#about .strength .storefrontList .slick-prev {
    left: -24px
}

#about .strength .storefrontList .slick-next {
    right: -24px
}

#about .strength .storefrontList .slick-prev i {
    background-position: left bottom
}

#about .strength .storefrontList .slick-next i {
    background-position: right bottom
}

#about .strength .storefrontList .slick-arrow:hover {
    background: #fff;
    color: #05b7db
}

#about .strength .storefrontList .slick-prev:hover i {
    background-position: left top;
    transform: translateX(-8px);
    -webkit-transform: translateX(-8px)
}

#about .strength .storefrontList .slick-next:hover i {
    background-position: right top;
    transform: translateX(8px);
    -webkit-transform: translateX(8px)
}

#about .exhibition .swiper-container, #about .honor .swiper-container {
    padding: 30px 0 50px 0
}

#about .exhibition .swiper-container .swiper-slide, #about .honor .swiper-container .swiper-slide {
    height: 180px;
    text-align: center;
    overflow: hidden
}

#about .exhibition .swiper-container .swiper-slide img, #about .honor .swiper-container .swiper-slide img {
    height: 100%;
    transition: all .5s
}

#about .exhibition .wjBtnWra, #about .honor .wjBtnWra {
    height: 39px;
    position: relative;
    margin-top: 24px
}

#about .exhibition .wjBtnWra>*, #about .honor .wjBtnWra>* {
    float: right
}

#about .exhibition .wjBtnWra.cur .wjBtnPres, #about .honor .wjBtnWra.cur .wjBtnPres {
    width: 39px;
    height: 39px;
    background: url(../images/wjbtnl.png) center;
    background-size: cover;
    -webkit-transition-duration: .5s;
    transition-duration: .5s;
    cursor: pointer;
    margin-right: 20px
}

#about .exhibition .wjBtnWra.cur .wjBtnNexts, #about .honor .wjBtnWra.cur .wjBtnNexts {
    width: 39px;
    height: 39px;
    background: url(../images/wjbtnr.png) center;
    background-size: cover;
    -webkit-transition-duration: .5s;
    transition-duration: .5s;
    cursor: pointer
}

#about .exhibition .wjBtnWra.cur .wjBtnPres:hover, #about .honor .wjBtnWra.cur .wjBtnPres:hover {
    background: url(../images/wjbtnls.png) center;
    background-size: cover
}

#about .exhibition .wjBtnWra.cur .wjBtnNexts:hover, #about .honor .wjBtnWra.cur .wjBtnNexts:hover {
    background: url(../images/wjbtnrs.png) center;
    background-size: cover
}

#about .honor .swiper-container .swiper-slide {
    height: auto;
    text-align: center
}

#about .honor .swiper-container .swiper-slide img {
    height: 320px
}

#about .honor .swiper-container .swiper-slide span {
    display: block;
    width: 100%;
    height: 50px;
    line-height: 50px;
    text-align: center;
    font-size: 14px
}

#about .vr {
    position: relative
}

#about .vr .conBox {
    text-align: center;
    color: #fff;
    padding: 75px 0
}

#about .vr .conBox h2 {
    font-size: 30px;
    font-weight: normal;
    padding: 5px 0
}

#about .vr .conBox p {
    font-size: 16px;
    padding: 5px 0 30px 0;
    line-height: 26px
}
#about  .yongyu img{
    width: 100%;
}
#about .yongyu .swiper-slide{
    padding: 10px;
}
#products .zq_list {
    width: 100%;
    max-width: 1500px;
    margin: auto;
    padding: 55px 50px
}

#products .zq_list a:link, #products .zq_list a:visited {
    font-weight: normal
}

#products .zq_list li {
    width: 100%;
    height: auto;
    overflow: hidden;
    background: #D6ECEC;
    margin-bottom: 55px;
    position: relative
}

#products .zq_list li .a {
    width: 0px;
    height: 1px;
    background: #23455b;
    position: absolute;
    left: 10px;
    top: 10px;
    -webkit-transition-duration: .4s
}

#products .zq_list li .b {
    width: 0px;
    height: 1px;
    background: #23455b;
    position: absolute;
    left: calc(100% - 10px);
    bottom: 10px;
    -webkit-transition-duration: .4s
}

#products .zq_list li .c {
    height: 0px;
    width: 1px;
    background: #23455b;
    position: absolute;
    left: 10px;
    bottom: 10px;
    -webkit-transition-duration: .4s
}

#products .zq_list li .d1 {
    height: 0px;
    width: 1px;
    background: #23455b;
    position: absolute;
    right: 10px;
    top: 10px;
    -webkit-transition-duration: .4s
}

#products .zq_list li .l {
    width: 50%;
    height: auto;
    float: left;
    overflow: hidden
}

#products .zq_list li .l img {
    width: 100%;
    display: block;
    -webkit-transition-duration: 0.4s
}

#products .zq_list li .r {
    color: #060606;
    width: calc(40% - 50px);
    height: calc(100% - 50px);
    right: 0;
    position: absolute
}

#products .zq_list li .r .e {
    width: 100%;
    height: auto;
    text-transform: uppercase;
    font-size: 30px
}

#products .zq_list li .r .e i, #products .zq_list li .r .e span {
    display: inline-block;
    vertical-align: top;
    padding: 0 5px
}

#products .zq_list li .r .l {
    width: 100%;
    height: 20px;
    position: relative
}

#products .zq_list li .r .l:after {
    width: 20px;
    height: 1px;
    -webkit-transition-duration: .4s;
    background: #23455b;
    position: absolute;
    left: 0px;
    top: 10px;
    content: ''
}

#products .zq_list li .r .z {
    font-size: 16px
}

#products .zq_list li .r .d {
    position: absolute;
    width: 100%;
    height: auto;
    position: relative;
    left: 0px;
    bottom: 25px;
    font-size: 14px;
    top: 10px;
    line-height: 25px;
    color: #141414
}

#products .zq_list li:hover .a {
    width: calc(100% - 20px)
}

#products .zq_list li:hover .b {
    left: 10px;
    width: calc(100% - 20px)
}

#products .zq_list li:hover .c {
    left: 10px;
    height: calc(100% - 20px)
}

#products .zq_list li:hover .d1 {
    height: calc(100% - 20px);
    top: 10px
}

#products .zq_list li:hover .l img {
    -webkit-transform: scale(1.1)
}

#products .zq_list li:hover .r .l:after {
    width: 200px;
    background: #23455b
}

#products .zq_list li:nth-child(2n) .l {
    float: right
}

#products .zq_list li:nth-child(2n) .r {
    left: 55px;
    margin-left: 0px
}

#product_list {
    padding: 77px 0 30px 0
}

#product_list .proListBanner {
    overflow: hidden;
    position: relative;
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center center;
    width: 92%;
    margin: 64px auto 0px
}

#product_list .proListBanner .proinner {
    position: absolute;
    width: 986px;
    left: 50%;
    top: 50%;
    height: 432px;
    margin: -216px 0px 0px -493px
}

#product_list .proListBanner .img {
    width: 100%;
    display: block
}

#product_list .proListBanner .bg {
    background-color: #fff;
    filter: alpha(opacity=80);
    opacity: 0.8;
    display: block;
    position: absolute;
    left: 0px;
    top: 0px;
    width: 100%;
    height: 100%
}

#product_list .proListBanner .pcon {
    position: relative;
    padding: 54px 8% 0px;
    display: block;
    color: #323232
}

#product_list .proListBanner .t {
    color: #40a4e3;
    float: left;
    display: block;
    position: relative
}

#product_list .proListBanner .t .name {
    font-size: 80px;
    line-height: 1
}

#product_list .proListBanner .t .en {
    font: 14px/1.2 "humanist_521_lightregular", "times new roman", "microsoft yahei";
    text-transform: uppercase;
    position: absolute;
    left: 110%;
    top: 5px
}

#product_list .proListBanner .t i {
    width: 13px;
    height: 22px;
    position: absolute;
    left: 110%;
    bottom: 0px
}

#product_list .proListBanner .title {
    font: 30px/1.4 "microsoft yahei";
    margin-bottom: 30px
}

#product_list .proListBanner .c {
    width: 80%;
    margin: 18px auto 0px;
    font-size: 14px;
    height: 220px;
    line-height: 25px;
    overflow: hidden
}

#product_list .proListBanner .ico {
    position: absolute;
    right: 10%;
    top: 20%
}

#product_list .proInfoBox {
    width: 92%;
    margin: 0px auto
}

#product_list .proInfoBox dd {
    float: left;
    display: block;
    margin-top: 50px;
    width: 49%;
    padding-bottom: 48px;
    position: relative
}

#product_list .proInfoBox dd.two {
    margin-left: 2%
}

#product_list .proInfoBox dd .img {
    width: 100%;
    display: block;
    overflow: hidden;
    position: relative
}

#product_list .proInfoBox dd .bg {
    position: absolute;
    left: 0px;
    top: 0px;
    width: 100%;
    height: 100%;
    opacity: 0;
    visibility: hidden;
    -webkit-transition: 0.3s;
    -moz-transition: 0.3s;
    -o-transition: 0.3s;
    transition: 0.3s
}

#product_list .proInfoBox dd .img img {
    width: 100%;
    display: block;
    -webkit-transition: 0.5s;
    -moz-transition: 0.5s;
    -o-transition: 0.5s;
    transition: 0.5s
}

#product_list .proInfoBox dd .con {
    position: absolute;
    left: 0px;
    bottom: 0px;
    border: 1px solid #eeeeee;
    padding: 25px 5%;
    width: 74%;
    background-color: #fff;
    color: #646464;
    -webkit-transition: 0.5s;
    -moz-transition: 0.5s;
    -o-transition: 0.5s;
    transition: 0.5s
}

#product_list .proInfoBox dd .con .t {
    font-size: 22px;
    line-height: 1.4;
    text-transform: uppercase;
    color: #000;
    margin-bottom: 30px
}

#product_list .proInfoBox dd:hover .bg {
    opacity: 1;
    visibility: visible
}

#product_list .proInfoBox dd:hover .img img {
    -webkit-transform: scale(1.1);
    transform: scale(1.1)
}

#product_list .proInfoBox dd:hover .con {
    transform: translateY(-20px);
    -webkit-transform: translateY(-20px)
}

#product_list .select {
    border: #ddd 1px solid;
    border-radius: 4px;
    width: 92%;
    margin: 40px auto 0 auto;
    font-size: 12px
}

#product_list .select li {
    list-style: none;
    padding: 10px 0 5px 100px
}

#product_list .select .select-list {
    border-bottom: #eee 1px dashed
}

#product_list .select dl {
    zoom: 1;
    position: relative;
    line-height: 24px
}

#product_list .select dl:after {
    content: " ";
    display: block;
    clear: both;
    height: 0;
    overflow: hidden
}

#product_list .select dt {
    width: 100px;
    margin-bottom: 5px;
    position: absolute;
    top: 0;
    left: -100px;
    text-align: right;
    color: #666;
    height: 24px;
    line-height: 24px
}

#product_list .select dd {
    float: left;
    display: inline;
    margin: 0 0 5px 5px
}

#product_list .select a {
    display: inline-block;
    white-space: nowrap;
    height: 24px;
    padding: 0 10px;
    text-decoration: none;
    color: #141414;
    border-radius: 2px
}

#product_list .select a:hover {
    color: #fff;
    background-color: #40a4e3
}

#product_list .select .selected a {
    color: #fff;
    background-color: #40a4e3
}

#product_list .select-result dt {
    font-weight: bold
}

#product_list .select-no {
    color: #999
}

#product_list .select .select-result a {
    padding-right: 20px;
    background: #40a4e3 url("../images/close.gif") right 9px no-repeat
}

#product_list .select .select-result a:hover {
    background-position: right -15px
}

#product_list .prolistPage {
    width: 92%;
    margin: 0px auto
}

#product_list .prolistPage .title {
    border-bottom: 1px solid #a0a0a0;
    margin: 40px auto;
    font-size: 20px;
    color: #000;
    padding-bottom: 15px
}

#product_list .prolist {
    margin-left: -2%
}

#product_list .prolist a:link, #product_list .prolist a:visited {
    color: #000
}

#product_list .prolist a:active, #product_list .prolist a:hover {
    color: #CD000F
}

#product_list .prolist dd {
    float: left;
    display: block;
    width: 48%;
    margin: 0px 0px 2% 2%;
    position: relative
}

#product_list .prolist .img {
    width: 76%;
    overflow: hidden;
    position: relative;
    cursor: pointer
}

#product_list .prolist .img .ico {
    background: url(../images/fd2.png) no-repeat;
    width: 44px;
    height: 44px;
    position: absolute;
    left: 50%;
    top: 50%;
    margin: -22px 0px 0px -22px;
    -webkit-transform: scale(0);
    transform: scale(0);
    opacity: 0;
    filter: alpha(opacity=0);
    -webkit-transition: 0.4s;
    -moz-transition: 0.4s;
    -o-transition: 0.4s;
    transition: 0.4s
}

#product_list .prolist .img img {
    width: 100%;
    display: block;
    -webkit-transition: 0.5s;
    -moz-transition: 0.5s;
    -o-transition: 0.5s;
    transition: 0.5s
}

#product_list .prolist .name {
    position: absolute;
    left: 78%;
    top: 8%;
    width: 22%;
    font-size: 16px;
    color: #000
}

#product_list .prolist .remark {
    position: absolute;
    left: 78%;
    top: 18%;
    width: 22%;
    font-size: 14px;
    color: #343434
}

#product_list .prolist .linkbox {
    position: absolute;
    right: 3%;
    bottom: 5%
}

#product_list .prolist .linkbox a {
    width: 34px;
    height: 34px;
    display: block;
    margin-top: 10px
}

#product_list .prolist .linkbox a i {
    display: block;
    background: url(../images/ii1.png) no-repeat;
    width: 100%;
    height: 100%;
    display: block;
    -webkit-transition: 0.5s;
    -moz-transition: 0.5s;
    -o-transition: 0.5s;
    transition: 0.5s
}

#product_list .prolist .linkbox a.ico2 i {
    background-image: url(../images/ii2.png)
}

#product_list .prolist dd:nth-child(2n) .img {
    margin-left: 24%
}

#product_list .prolist dd:nth-child(2n) .name {
    left: 2%
}

#product_list .prolist dd:nth-child(2n) .remark {
    left: 2%
}

#product_list .prolist dd:nth-child(2n) .linkbox {
    right: 80%
}

#product_list .prolist .linkbox a:hover i {
    transform: rotateY(180deg)
}

#product_list .prolist .img:hover img {
    -webkit-transform: scale(1.1);
    transform: scale(1.1);
    filter: alpha(opacity=50)
}

#product_list .prolist .img:hover .ico {
    -webkit-transform: scale(1);
    transform: scale(1);
    opacity: 1;
    filter: alpha(opacity=100)
}

#product_list .more {
    margin-bottom: 37px
}

#product_show {
    padding: 77px 0 0 0
}

#product_show .imgBox {
    padding: 50px 200px
}

#product_show .imgBox .l {
    width: 50%;
    overflow: hidden;
    text-align: center
}

#product_show .imgBox .l img {
    width: 100%
}

#product_show .imgBox .r {
    width: 50%;
    padding: 15px 40px;
    line-height: 23px
}

#product_show .imgBox .r h2 {
    font-size: 30px;
    font-weight: normal;
    color: #252525;
    padding: 30px 0
}

#product_show .imgBox .r h3 {
    font-size: 20px;
    font-weight: normal;
    color: #777373
}

#product_show .imgBox .r h4, #product_show .imgBox .r p {
    font-size: 14px;
    font-weight: normal;
    color: #a1a1a1;
    padding: 5px 0
}

#product_show .imgBox .r .line {
    width: 60px;
    height: 2px;
    background: #d0416d
}

#product_show .imgBox .r ul {
    padding-top: 30px;
    font-size: 16px
}

#product_show .imgBox .r b {
    color: #333
}

#product_show .imgBox .r .appoint {
    background: #b28a4c;
    color: #fff;
    font-size: 20px;
    display: inline-block;
    height: 52px;
    line-height: 52px;
    padding: 0 20px;
    transition: .5s;
    margin: 20px 0
}

#product_show .imgBox .r .appoint i {
    font-size: 35px
}

#product_show .imgBox .r .appoint span, #product_show .imgBox .r .appoint i {
    display: inline-block;
    vertical-align: top;
    padding: 0 5px
}

#product_show .imgBox .r .appoint:hover {
    background: #009acd
}

#product_show .vip {
    background: #000;
    color: #fff;
    text-align: center;
    padding: 120px 0 90px 0
}

#product_show .vip h2 {
    font-size: 40px;
    font-weight: normal
}

#product_show .vip p {
    font-size: 14px;
    padding: 30px 0 50px 0
}

#product_show .vip a {
    color: #fff
}

.sub_nav {
    background: #b28a4c;
    height: 60px;
    text-align: center
}

.sub_nav a {
    color: #fff;
    font-size: 16px;
    height: 60px;
    line-height: 60px;
    display: inline-block;
    padding: 0 60px
}

.sub_nav a:hover, .sub_nav a.active {
    background: #0195ad
}

#news_list {
    background: #f2f3f3;
    padding-bottom: 30px
}

#news_list .listBox {
    width: 100%;
    padding: 20px 0
}

#news_list .listBox .con {
    width: 94%;
    padding-left: 3%;
    overflow: hidden
}

#news_list .listBox .con a {
    display: block;
    float: left;
    width: 23%;
    background: #fff;
    border: 1px solid #dcdcdc;
    transition: all .8s ease-in-out;
    padding: 10px 20px;
    margin: 0 0 2% 2%;
        height: 400px;
}

#news_list .listBox .con a h2 {
    font-size: 15px;
    height: 50px;
    line-height: 22px;
    color: #464545;
    font-weight: normal;
    padding-bottom: 10px
}

#news_list .listBox .con a .pic {
    height: 250px;
    overflow: hidden;
    position: relative
}

#news_list .listBox .con a img {
    height: 100%;
    width: auto;
    display: block
}

#news_list .listBox .con a p {
    font-size: 12px;
    color: #6e6e6e;
    padding: 15px 0;
    line-height: 21px;
    height: 60px;
    overflow: hidden;
    margin-bottom: 5px
}

#news_list .listBox .con a span {
    color: #6e6e6e
}

#news_list .listBox .con a .bt .ico {
    width: 50px;
    float: left;
    background: red
}

#news_list .listBox .con a .bt .t {
    float: right
}

#news_list .listBox .con a:hover {
    box-shadow: 1px 4px 10px 2px #CCC
}

#news_show {
    text-align: center;
    color: #434343;
    padding-bottom: 30px;
    background-color: #ebf0f3;
    overflow: hidden
}

#news_show .con {
    width: 90%;
    max-width: 1200px;
    margin: 100px auto 0 auto;
    padding: 38px 0px 0px;
    background-color: #fff;
    position: relative;
    overflow: hidden
}

#news_show .con .lbot {
    width: 100%;
    height: 8px;
    background-color: #799dcd;
    position: absolute;
    left: 0px;
    top: 0px
}

#news_show .con .lbot i {
    width: 160px;
    height: 8px;
    background-color: #215bab;
    display: block
}

#news_show .con .infoT {
    border-bottom: 1px solid #ccc;
    padding-bottom: 32px;
    margin: 0px 32px 30px;
    color: #989898;
    text-align: left;
    position: relative
}

#news_show .con .infoT .t {
    font-size: 18px;
    color: #666;
    line-height: 1.2;
    margin-bottom: 14px
}

#news_show .con .infoT .ntime {
    background: url(../images/new_i1.png) no-repeat scroll left center;
    padding: 4px 0px 2px 22px;
    margin-right: 12px
}

#news_show .con .infoT .nease {
    background: url(../images/new_i2.png) no-repeat scroll left center;
    padding: 4px 0px 2px 28px
}

#news_show .con .infoT .nsharp {
    float: right;
    display: block
}

#news_show .con .nsharp a {
    padding-left: 20px;
    height: 20px;
    margin-left: 6px;
    display: inline-block;
    background: url(../images/sharp3.png);
    float: left
}

#news_show .con .nsharp a.i1 {
    background-position: 0px 0px
}

#news_show .con .nsharp a.i1:hover {
    background-position: 0px -20px
}

#news_show .con .nsharp a.i2 {
    background-position: -50px 0px
}

#news_show .con .nsharp a.i2:hover {
    background-position: -50px -20px
}

#news_show .con .nsharp a.i3 {
    background-position: -95px 0px
}

#news_show .con .nsharp a.i3:hover {
    background-position: -95px -20px
}

#news_show .con .pageCon {
    overflow: hidden;
    line-height: 2;
    color: #666;
    font-size: 14px;
    text-align: justify;
    margin: 0px 32px;
    padding: 0 30px 50px 30px
}

#news_show .con .pageCon img {
    max-width: 100%
}

#news_show .con .pageCon a:link, #news_show .con .pageCon a:visited {
    color: #4f7cb7
}

#news_show .con .pageCon a:active, #news_show .con .pageCon a:hover {
    color: #c62923
}

#news_show .con .infoPaging a {
    height: 48px;
    color: #fff;
    font: 14px/48px "microsoft yahei";
    width: 33.33%;
    float: left;
    display: block;
    text-align: center;
    background-color: #799dcd;
    overflow: hidden
}

#news_show .con .infoPaging a.list {
    margin: 0px 0.1%;
    width: 33.03%
}

#news_show .con .infoPaging a.list span {
    background: url(../images/list.png) no-repeat scroll left center;
    padding-left: 38px;
    display: inline-block;
    color: #fff
}

#news_show .con .infoPaging a:hover {
    color: #fff;
    background-color: #215bab
}

#news_show .con .infoPaging a.pprev span {
    background: url(../images/pagign_l.png) no-repeat scroll left center;
    padding-left: 32px
}

#news_show .con .infoPaging a.pnext span {
    background: url(../images/pagign_r.png) no-repeat scroll right center;
    padding-right: 32px
}

#news_show h2 {
    font-size: 30px;
    color: #121212;
    padding: 20px 0 0 0
}

#news_show h3 {
    font-size: 14px;
    font-weight: normal;
    padding: 10px 20px;
    border-bottom: 1px solid #dcdcdc;
    width: 95%;
    margin: auto
}

#news_show .text-con {
    font-size: 14px;
    line-height: 25px;
    padding: 10px 140px
}

#news_show .text-con img {
    max-width: 100%
}

#news_show .botBox {
    padding: 50px 40px
}

#news_show .botBox .paging {
    width: 80%;
    text-align: left;
    line-height: 30px;
    font-size: 14px
}

#news_show .botBox .fr {
    width: 15%;
    text-align: right
}

#news_show .botBox .fr .returnBtn {
    margin: 0 0 0 auto
}

#news_show .redList {
    width: 1200px;
    margin: auto;
    background: #fff;
    margin-top: 30px
}

#news_show .redList .list {
    padding: 0 50px
}

#news_show .redList .list a {
    display: block;
    width: 100%;
    padding: 20px
}

#news_show .redList .list a img {
    width: 100%
}

#news_show .redList .list a h2 {
    color: #121212;
    font-weight: normal;
    font-size: 15px;
    padding: 10px 20px;
    margin: 0;
    transition: .5s
}

#news_show .redList .list a:hover h2 {
    background: #b28a4c;
    color: #fff
}

html.open, html.open body {
    overflow: hidden;
    width: 100%
}

html.open .frameHtml {
    overflow-y: auto;
    transform: translate(0, 0);
    -webkit-transform: translate(0, 0)
}

html.open .frameHtmlact .frameClose {
    transform: translate(0, 0)
}

.frameHtml {
    position: fixed;
    top: 0;
    left: 0;
    right: 0px;
    bottom: 0px;
    z-index: 1006;
    height: 100%;
    background: url(../images/bg.png) repeat;
    overflow: hidden;
    -webkit-overflow-scrolling: touch;
    transform: translate(100%, 0);
    -webkit-transform: translate(100%, 0);
    transition: 400ms
}

.frame-ct-wrap {
    overflow: hidden;
    padding: 0 20px 20px
}

.frame-ct {
    position: relative;
    margin: 0px auto 0 80px;
    height: 100%;
    background: #fff;
    z-index: 1010;
    cursor: auto;
    width: 100%
}

.frame-title {
    display: block;
    background-color: #ededed;
    padding: 5% 0px
}

.frame-title .t1 {
    color: #5e5e5e;
    font: 40px/1.5 "microsoft yahei"
}

.frame-title .t2 {
    color: #5d5d5d;
    font-family: "microsoft yahei";
    font-size: 20px
}

.frame-title .time {
    padding-top: 10px
}

.frame-title .time .d {
    color: #bcbbbb;
    background: url(../images/time.png) no-repeat scroll left center;
    padding-left: 26px
}

.frame-title a:link, .frame-title a:visited {
    color: #80abde
}

.frame-title a:active, .frame-title a:hover {
    color: #174F90
}

.frame-ct-preview {
    padding: 66px 0px;
    overflow: hidden
}

.framC {
    color: #808080;
    font-size: 14px
}

.framC a:link, .framC a:visited {
    color: #80abde
}

.framC a:active, .framC a:hover {
    color: #174F90
}

.framC img {
    max-width: 100%;
    height: auto !important
}

.list-description {
    padding: 65px 0px;
    background-color: #ededed
}

.list-description a:link, .list-description a:visited {
    color: #bcbbbb
}

.list-description a:active, .list-description a:hover {
    color: #3a3a3a
}

.frameClose {
    display: block;
    width: 80px;
    height: 80px;
    position: fixed;
    left: 0px;
    top: 50%;
    margin-top: -35px;
    z-index: 1008;
    overflow: hidden;
    transform: translateX(-80px);
    transition: 400ms
}

.frameClose span {
    display: block;
    width: 100%;
    height: 100%;
    text-align: center;
    transition: 0.4s
}

.frameClose span.i0 {
    font: 16px/1.2 "microsoft yahei";
    color: #fff;
    background-color: #80abde;
    padding-top: 20px;
    height: 80px;
    position: absolute;
    left: 0px;
    top: 0px
}

.frameClose span.i1 {
    background: url(../images/fram_close.png) no-repeat scroll center center #174F90;
    color: #fff;
    position: absolute;
    left: 100%;
    top: 0px
}

.frameClose:hover span.i0 {
    left: -80px
}

.frameClose:hover span.i1 {
    left: 0px
}

.case_nav {
    width: 100%;
    position: absolute;
    bottom: 0;
    left: 0;
    text-align: center
}

.case_nav .box {
    width: 90%;
    max-width: 1300px;
    margin: auto
}

.case_nav .box a {
    width: 50%;
    display: block;
    float: left;
    overflow: hidden;
    font-size: 0
}

.case_nav .box a img {
    width: 100%;
    -webkit-transform: scale(1);
    transform: scale(1);
    transition: .5s
}

.case_nav .box a:hover img {
    -webkit-transform: scale(1.1);
    transform: scale(1.1)
}

#case {
    background: #f7f6f6;
    padding-bottom: 45px
}

#case .search .title {
    text-align: center;
    padding: 50px 0 20px 0
}

#case .search .title div {
    display: inline-block;
    vertical-align: top
}

#case .search .title h2 {
    font-size: 32px;
    font-style: italic;
    text-align: left;
    padding-left: 15px
}

#case .search .title h3 {
    font-size: 20px;
    text-align: left;
    font-weight: normal;
    padding-left: 15px
}

#case .search .iBox {
    text-align: center
}

#case .search .iBox input {
    padding: 10.5px 20px;
    font-size: 16px;
    vertical-align: top
}

#case .search .iBox .nmore {
    background: #b28a4c;
    display: inline-block;
    vertical-align: top
}

#case .search .iBox .nmore .bg {
    background: red
}

#case .industryfix {
    padding: 42px 28px 34px
}

#case .industryfix li {
    width: 32.8%;
    float: left;
    margin-right: 0.8%;
    margin-bottom: 14px;
    background: #fff
}

#case .industryfix li:nth-child(3n+3) {
    margin-right: 0
}

#case .industryfix li figure {
    display: block;
    overflow: hidden;
    position: relative
}

#case .industryfix li figure img {
    display: block;
    width: 100%;
    height: auto;
    line-height: 1;
    transition: 650ms
}

#case .industryfix li figure strong {
    display: block;
    width: 92px;
    height: 66px;
    background: url(../images/shou.png) center no-repeat;
    position: absolute;
    right: 0;
    top: 0;
    z-index: 5
}

#case .industrytext {
    padding: 15px 22px 18px;
    background: #fff;
    transition: 430ms;
    position: relative
}

#case .industrytext h4 {
    color: #000000;
    transition: 320ms;
    font-size: 18px;
    line-height: 1;
    font-weight: normal
}

#case .intdustrs span {
    display: inline-block;
    float: left;
    margin-right: 22px;
    color: #646464;
    font-size: 16px;
    line-height: 1.4;
    transition: 320ms
}

#case .industrytext b {
    display: inline-block;
    color: #fff;
    position: absolute;
    right: 26px;
    line-height: 1;
    top: 28px;
    opacity: 0;
    visibility: hidden;
    transition: 320ms
}

#case .industryfix li:hover figure img {
    transform: scale(1.04);
    -webkit-transform: scale(1.04);
    -moz-transform: scale(1.04)
}

#case .industryfix li:hover .industrytext {
    background: #b28a4c
}

#case .industryfix li:hover .industrytext h4, #case .industryfix li:hover .industrytext .intdustrs span {
    color: #fff
}

#case .industryfix li:hover .industrytext b {
    opacity: 1;
    visibility: visible
}

#stores {
    padding-bottom: 60px;
    background: #fafafa
}

#stores .search {
    position: absolute;
    top: 20px;
    left: 0;
    right: 0
}

#stores .search .title {
    text-align: center;
    padding: 50px 0 20px 0
}

#stores .search .title div {
    display: inline-block;
    vertical-align: top
}

#stores .search .title h2 {
    font-size: 32px;
    font-style: italic;
    text-align: left;
    padding-left: 15px
}

#stores .search .title h3 {
    font-size: 20px;
    text-align: left;
    font-weight: normal;
    padding-left: 15px
}

#stores .search .iBox {
    text-align: center
}

#stores .search .iBox input {
    padding: 10.5px 20px;
    font-size: 16px;
    vertical-align: top
}

#stores .search .iBox .nmore {
    background: #b28a4c;
    display: inline-block;
    vertical-align: top
}

#stores .search .iBox .nmore .bg {
    background: #b28a4c
}

#stores .wo1 {
    position: relative
}

#stores .sshop .s-select {
    background-image: url(../images/ssaw.png);
    background-repeat: no-repeat;
    background-position: 230px center;
    height: 44px;
    padding: 0 20px;
    width: 270px;
    background-color: #fff;
    float: left;
    display: block;
    color: #666;
    margin-right: 10px
}

#stores .sshop .sbtn {
    color: #fff;
    font-size: 16px;
    text-align: left;
    padding: 0 0 0 50px;
    cursor: pointer;
    transition: 300ms;
    -webkit-transition: 300ms;
    width: 160px;
    height: 44px;
    display: block;
    background: #333 url(../images/shop.png) no-repeat 95px center;
    margin-top: 40px;
    border: none
}

#stores .sshop .sbtn:hover {
    background-color: #b28a4c
}

#stores .sshop .s {
    margin-top: 50px
}

#stores .sshop {
    position: absolute;
    top: 31%;
    left: 50%;
    margin-left: -600px
}

#stores .abti .ch {
    color: #333;
    margin-bottom: 10px;
    font-size: 16px
}

#stores .abti .en {
    color: #333;
    text-transform: uppercase;
    font-size: 36px;
    line-height: 0.8;
    font-family: 'moolbor';
    margin-bottom: 2
}

#stores .woList a {
    display: block;
    width: 30.33%;
    margin-left: 3%;
    margin-bottom: 3%;
    float: left;
    color: #000;
    background: #fff;
    overflow: hidden
}

#stores .woList a .pic {
    overflow: hidden
}

#stores .woList a img {
    width: 100%
}

#stores .woList {
    margin-left: -3%
}

#stores .woList .txts {
    padding: 20px 35px;
    color: #000
}

#stores .woList .txts .nowti {
    font-size: 16px
}

#stores .woList .txts .tx {
    height: 24px;
    margin-top: 4px
}

#stores .woList a:hover {
    background: #1794dc;
    box-shadow: 0 0 16px -4px rgba(0, 0, 0, 0.3)
}

#stores .woList a:hover .txts {
    color: #fff
}

.inner .title {
    text-align: center;
    padding: 30px 0 30px 0
}

.inner .title h2.en {
    font-size: 24px;
    color: #b28a4c;
    text-transform: uppercase;
    font-weight: normal;
    padding: 0
}

.inner .title h2.cn {
    color: #313131;
    font-size: 30px;
    padding: 5px 0;
    font-weight: normal
}

.inner .title .line {
    width: 30px;
    height: 4px;
    background: #b28a4c;
    margin: auto
}

.inner .title h3 {
    font-size: 18px;
    font-weight: normal
}

#service {
    text-align: center
}

#service .prccess {
    text-align: left
}

#service .prccess li {
    padding: 30px 0;
    overflow: hidden
}

#service .prccess li h2 {
    font-size: 24px;
    color: #313131;
    padding: 10px 0;
    font-weight: normal
}

#service .prccess li h2 i {
    display: inline-block;
    width: 10px;
    height: 10px;
    background: #b28a4c;
    margin: 0 10px
}

#service .prccess li p {
    font-size: 16px;
    line-height: 30px;
    padding: 10px 20px 10px 30px
}

#service .prccess li .t {
    height: 40px;
    margin: 10px 0 0 30px
}

#service .prccess li .t b {
    background: #eee;
    padding: 10px 20px
}

#service .prccess li .t span {
    font-size: 16px;
    padding: 0 0 0 10px
}

#service .prccess li:nth-child(2n) {
    background: #e5e5e5
}

#service .appointBtn {
    background: #b28a4c;
    display: inline-block;
    vertical-align: top;
    border-radius: 5px;
    margin: 60px auto
}

#service .appointBtn .bg {
    background: red;
    border-radius: 5px
}

#service #dialogBg {
    width: 100%;
    height: 100%;
    background-color: #000000;
    opacity: .8;
    filter: alpha(opacity=60);
    position: fixed;
    top: 0;
    left: 0;
    z-index: 3;
    display: none
}

#service #dialog {
    width: 300px;
    margin: 0 auto;
    display: none;
    background-color: #ffffff;
    position: fixed;
    top: 50%;
    left: 50%;
    margin: -120px 0 0 -150px;
    z-index: 10000;
    border: 1px solid #ccc;
    border-radius: 10px;
    -webkit-border-radius: 10px;
    box-shadow: 3px 2px 4px rgba(0, 0, 0, 0.2);
    -webkit-box-shadow: 3px 2px 4px rgba(0, 0, 0, 0.2)
}

#service #dialog * {
    box-sizing: content-box
}

#service .dialogTop {
    width: 90%;
    margin: 0 auto;
    border-bottom: 1px dotted #ccc;
    letter-spacing: 1px;
    padding: 10px 0;
    text-align: right
}

#service .dialogIco {
    width: 50px;
    height: 50px;
    position: absolute;
    top: -25px;
    left: 50%;
    margin-left: -25px
}

#service .editInfos {
    padding: 15px 0
}

#service .editInfos li {
    width: 90%;
    margin: 8px auto auto;
    text-align: center
}

#service .ipt {
    border: 1px solid #ccc;
    padding: 10px;
    width: 68%;
    border-radius: 3px;
    -webkit-border-radius: 3px;
    box-shadow: 0 0 3px #ccc inset;
    -webkit-box-shadow: 0 0 3px #ccc inset;
    margin-left: 5px
}

#service .ipt:focus {
    outline: none;
    border-color: #66afe9;
    box-shadow: 0 1px 1px rgba(0, 0, 0, 0.075) inset, 0 0 8px rgba(102, 175, 233, 0.6);
    -webkit-box-shadow: 0 1px 1px rgba(0, 0, 0, 0.075) inset, 0 0 8px rgba(102, 175, 233, 0.6)
}

#service .Validform_checktip {
    font-size: 14px;
    display: block
}

#service .submitBtn {
    width: 90px;
    height: 30px;
    line-height: 30px;
    font-family: "微软雅黑", "microsoft yahei";
    cursor: pointer;
    margin-top: 10px;
    display: inline-block;
    border-radius: 5px;
    -webkit-border-radius: 5px;
    text-align: center;
    background-color: #428bca;
    color: #fff;
    box-shadow: 0 -3px 0 #2a6496 inset;
    -webkit-box-shadow: 0 -3px 0 #2a6496 inset
}

#keji .storyPage {
    padding: 30px 0 0 0px;
    width: 90%;
    min-width: 1000px;
    margin: auto
}

#keji .storyPage a:link, #keji .storyPage a:visited {
    color: #323232
}

#keji .storyPage a:active, #keji .storyPage a:hover {
    color: #cd000f
}

#keji .storyPage dd {
    background-color: #fff;
    overflow: hidden;
    position: relative
}

#keji .storyPage dd:hover .ln {
    margin-left: -24px
}

#keji .storyPage dd:hover .con .line {
    width: 100%
}

#keji .storyPage dd:hover .storyMore {
    background-color: #df0024;
    border-color: #df0024;
    color: #fff
}

#keji .storyPage dd:hover .img img {
    -webkit-transform: scale(1.1);
    transform: scale(1.1)
}

#keji .storyPage dd.two:hover .ln {
    margin-right: -24px
}

#keji .storyPage .img {
    float: left;
    display: block;
    width: 50%;
    overflow: hidden
}

#keji .storyPage .img img {
    width: 100%;
    display: block;
    -webkit-transition: 0.5s;
    -moz-transition: 0.5s;
    -o-transition: 0.5s;
    transition: 0.5s
}

#keji .storyPage .ln {
    background: url(../images/lingx.png) no-repeat scroll center center;
    height: 100%;
    position: absolute;
    left: 50%;
    width: 49px;
    display: block
}

#keji .storyPage .two .img {
    float: right
}

#keji .storyPage .two .ln {
    left: auto;
    right: 50%
}

#keji .storyPage .con {
    display: block;
    float: left;
    width: 50%;
    height: 100%;
    position: relative;
    text-align: center;
    z-index: 2
}

#keji .storyPage .con .text {
    display: inline-block;
    text-align: left
}

#keji .storyPage .con .t {
    font-size: 26px;
    color: #323232;
    line-height: 1.4;
    height: 89px
}

#keji .storyPage .con .t .line {
    width: 0px;
    height: 1px;
    background-color: #df0024;
    display: block;
    margin-bottom: 15px
}

#keji .storyPage .con h2 {
    font-size: 40px;
    color: #bda5cb;
    padding: 10px 0 0 0
}

#keji .storyPage .con h3 {
    font-size: 28px;
    color: #bda5cb
}

#keji .storyPage .con p {
    font-size: 14px;
    color: #585757;
    padding: 20px 0
}

#keji .storyPage .con .c {
    height: 76px;
    overflow: hidden;
    margin-bottom: 8%;
    color: #323232
}

#keji .storyPage .con .storyMore {
    border: 1px solid #9a9a9a;
    width: 124px;
    height: 40px;
    line-height: 40px;
    display: block;
    text-align: center
}

#keji .ad {
    margin: 20px 0
}

#keji .share {
    text-align: center;
    padding: 30px 0;
    cursor: pointer
}

#keji .share span {
    color: #a37e2c;
    font-size: 14px;
    border: 1px solid #a37e2c;
    display: inline-block;
    padding: 5px 10px
}

.manage #storyPage .con .text {
    padding-bottom: 50px
}

.manage #storyPage .con .text h2 {
    font-size: 24px;
    color: #313131;
    text-align: center;
    padding: 20px 0;
    line-height: 35px;
    font-weight: normal
}

.manage #storyPage .con .text p {
    font-size: 16px;
    color: #313131;
    padding: 5px 0;
    text-align: center;
    line-height: 25px
}

.manage #storyPage .con .text p i {
    display: inline-block;
    width: 10px;
    height: 10px;
    background: #b28a4c;
    margin: 5px 10px;
    vertical-align: top
}

.manage #storyPage .con .text p span {
    display: inline-block;
    width: 75%;
    text-align: left
}

#feedback {
    background: #ebf0f3;
    padding-bottom: 50px
}

#feedback .nav {
    text-align: center;
    margin: 20px auto 50px auto
}

#feedback .nav a {
    display: inline-block;
    width: 220px;
    height: 60px;
    line-height: 60px;
    font-size: 16px;
    color: #313131;
    background: #fff;
    margin: 0 20px;
    border-radius: 5px
}

#feedback .nav a:hover, #feedback .nav a.active {
    color: #fff;
    background: #b28a4c
}

#feedback .con {
    background: #fff;
    height: 576px
}

#feedback .con .from {
    float: left;
    width: 686px;
    color: #555;
    text-align: center;
    padding: 0 40px
}

#feedback .con .from h2 {
    font-size: 25px;
    padding: 35px 0 25px 0
}

#feedback .con .from p.remark {
    font-size: 16px;
    width: 77%;
    margin: auto;
    text-align: left;
    padding-bottom: 20px
}

#feedback .con .from input {
    display: inline-block;
    width: 48%;
    margin: 1% 1% 0 0;
    height: 45px;
    line-height: 45px;
    color: #676666;
    font-size: 15px;
    border: 1px solid #e5e5e5;
    padding: 0 20px
}

#feedback .con .from textarea {
    width: 97%;
    margin: 1% 1% 0 0;
    font-size: 15px;
    border: 1px solid #e5e5e5;
    padding: 10px 20px;
    height: 135px
}

#feedback .con .from button {
    width: 97%;
    height: 56px;
    border: none;
    background: #555;
    color: #fff;
    text-align: center;
    font-size: 15px;
    margin: 8% 1% 0 0;
    cursor: pointer
}

#feedback .con .img {
    width: 514px;
    float: right
}

#feedback .con .Validform_checktip {
    position: absolute;
    bottom: 22%;
    left: 0;
    padding: 10px 50px;
    text-align: center;
    width: 686px
}

#feedback .con .Validform_wrong {
    color: red;
    font-size: 14px
}

#contact {
    text-align: center
}

#contact .title {
    text-align: center;
    padding: 30px 0 30px 0
}

#contact .title h2.en {
    font-size: 24px;
    color: #b28a4c;
    text-transform: uppercase;
    font-weight: normal;
    padding: 0
}

#contact .title h2.cn {
    color: #313131;
    font-size: 30px;
    padding: 5px 0;
    font-weight: normal
}

#contact .title .line {
    width: 30px;
    height: 4px;
    background: #b28a4c;
    margin: auto
}

#contact .title h3 {
    font-size: 18px;
    font-weight: normal
}

#contact .conBox {
    width: 92%;
    max-width: 1500px;
    margin: auto;
    padding: 30px 0
}

#contact .conBox li {
    width: 30%;
    margin: 1.5%;
    float: left;
    background: #f7f7f7;
    overflow: hidden;
    transition: .5s;
    cursor: pointer
}

#contact .conBox li img {
    width: 100%
}

#contact .conBox li h2 {
    font-size: 24px;
    font-weight: normal;
    color: #535353;
    padding: 30px 20px
}

#contact .conBox li p {
    font-size: 18px;
    color: #7d7d7d;
    padding: 0 20px 30px 20px;
    height: 90px
}

#contact .conBox li:hover {
    box-shadow: 0px 3px 17px #ccc
}

#bdmap {
    width: 100%;
    height: 100%
}

#bdmap * {
    box-sizing: content-box
}

#join .innerBanner .slogan {
    font-size: 40px;
    line-height: 60px;
    color: #fff;
    position: absolute;
    top: 35%;
    left: 10%;
    z-index: 2
}

#join .title {
    padding: 50px 0;
    text-align: center
}

#join .title h2 {
    text-align: center;
    color: #323232;
    font-size: 28px;
    font-weight: bold;
    line-height: 1.4;
    padding: 5px 0
}

#join .title h3 {
    text-align: center;
    font-size: 24px;
    color: #b28a4c;
    text-transform: uppercase;
    font-weight: normal;
    padding: 0;
    margin: auto
}

#join .title .line {
    width: 30px;
    height: 4px;
    background: #b28a4c;
    margin: auto
}

#join .title .remark {
    font-size: 16px;
    color: #525252;
    line-height: 28px
}

#join .title span {
    display: block;
    font-size: 20px;
    color: #535353;
    padding: 20px 0
}

#join .box {
    text-align: center;
    padding-bottom: 50px
}

#join .box img {
    max-width: 1200px
}

#join .join1 .list {
    width: 90%;
    margin: 0px auto
}

#join .join1 .list dd {
    margin-left: 1%;
    width: 19%;
    float: left;
    display: block;
    cursor: pointer
}

#join .join1 .list dd.lin1 {
    margin-left: 0
}

#join .join1 .list .img {
    width: 100%;
    overflow: hidden;
    position: relative
}

#join .join1 .list .img img {
    width: 100%;
    display: block;
    transition: all .8s ease-out
}

#join .join1 .list .con {
    background: url(../images/red_2.png) repeat;
    background: none rgba(230, 0, 18, 0.9);
    position: absolute;
    left: 0px;
    width: 100%;
    height: 100%;
    top: 100%;
    transition: all 0.5s ease 0s;
    -webkit-transform: all 0.5s ease 0s
}

#join .join1 .list .con .txt {
    width: 80%;
    border-top: 1px solid #fff;
    margin: 30px auto;
    font-size: 12px;
    color: #fff;
    padding-top: 30px
}

#join .join1 .list .text {
    position: relative;
    overflow: hidden;
    margin-top: 2px;
    padding: 26px 10px;
    background: #f0f4f5
}

#join .join1 .list .text p {
    position: relative;
    z-index: 2;
    transition: all 0.3s ease 0s;
    -webkit-transform: all 0.3s ease 0s
}

#join .join1 .list .text p.c {
    height: 20px;
    line-height: 20px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap
}

#join .join1 .list .text p.name {
    font-size: 20px;
    color: #000;
    line-height: 1.4
}

#join .join1 .list .bg {
    background: #23455b;
    position: absolute;
    left: 0px;
    top: 0px;
    width: 0;
    height: 100%;
    transition: all 0.4s ease 0s;
    -webkit-transform: all 0.4s ease 0s
}

#join .join1 .list dd:hover .bg {
    width: 100%
}

#join .join1 .list dd:hover p.name, #join .join1 .list dd:hover p a {
    color: #fff
}

#join .join2 .list li {
    overflow: hidden;
    padding: 20px 0
}

#join .join2 .list li .text {
    float: left;
    width: 40%;
    padding: 0 5%
}

#join .join2 .list li .text h2 {
    font-size: 30px;
    color: #313131;
    font-weight: normal;
    padding: 10px 0
}

#join .join2 .list li .text p {
    font-size: 14px;
    color: #535353;
    line-height: 25px
}

#join .join2 .list li .text .btn {
    display: inline-block;
    margin: 10%;
    border: 1px solid #666;
    color: #666;
    padding: 12px 70px 12px 50px;
    font-size: 14px;
    background: url(../images/btn_bg.png) 150px 150px no-repeat;
    background-size: 15%
}

#join .join2 .list li .text .btn:hover {
    background-position: 150px center
}

#join .join2 .list li img {
    float: right;
    width: 60%
}

#join .join2 .list li:nth-child(2n) .text {
    float: right
}

#join .join2 .list li:nth-child(2n) img {
    float: left
}

#join .join3 .list a {
    display: block;
    width: 100%
}

#join .join3 .list img {
    width: 100%
}

#join .join3 .owl-controls {
    position: absolute;
    bottom: 20px;
    left: 0;
    overflow: hidden;
    width: 100%;
    text-align: center
}

#join .join3 .owl-theme .owl-controls .owl-page span {
    opacity: 1;
    background: #fff;
    opacity: .7;
    width: 15px;
    height: 15px
}

#join .join3 .owl-theme .owl-controls .active span {
    opacity: 1;
    background: #fff
}

#join .join3 .proList {
    background: #eee;
    padding-bottom: 50px;
    overflow: hidden
}

#join .join3 .proList dl {
    width: 90%;
    max-width: 1500px;
    margin: auto
}

#join .join3 .proList dl dd {
    width: 25%;
    float: left;
    height: 100%;
    background: #1b2855;
    position: relative;
    cursor: pointer
}

#join .join3 .proList dl dd .pic {
    height: 524px;
    height: 100%;
    background-size: cover;
    transition: .5s
}

#join .join3 .proList dl dd .text {
    text-align: center;
    padding: 20px 0;
    background: #fff
}

#join .join3 .proList dl dd .text i {
    font-size: 19px;
    color: #535353;
    font-style: normal
}

#join .join3 .proList dl dd .text span {
    display: block;
    font-size: 18px;
    padding: 10px 0 0 0
}

#join .join3 .proList dl dd .act {
    width: 100%;
    height: 64%;
    background: #1b2855;
    text-align: center;
    color: #fff;
    position: absolute;
    bottom: -38px;
    left: 0;
    transition: .5s;
    transform: translateY(20px);
    opacity: 0
}

#join .join3 .proList dl dd .act i {
    font-size: 19px;
    font-style: normal
}

#join .join3 .proList dl dd .act span {
    display: block;
    font-size: 18px;
    padding: 15px 0 30px 0
}

#join .join3 .proList dl dd .act p {
    padding: 0 0 30px 0;
    font-size: 14px;
    line-height: 28px
}

#join .join3 .proList dl dd:hover .act {
    transform: translateY(0px);
    opacity: 1
}

#join .join3 .proList dl dd:hover .pic {
    transform: translateY(-50%)
}

#join .join5 .swiper-slide {
    width: auto;
    padding-top: 10px
}

#join .join5 .swiper-slide a span {
    padding: 10px 0;
    display: block;
    text-align: center;
    font-size: 16px
}

#join .join5 .swiper-slide img {
    height: 306px
}

#join .join6 {
    border-top: 30px solid #eeeeed
}

#join .join7 {
    background: #f3f3f3;
    padding-bottom: 60px
}

#join .join7 .conBox .con {
    height: 355px;
    overflow: hidden
}

#join .join7 .conBox .con .item .pic {
    width: 50%
}

#join .join7 .conBox .con .item .text {
    width: 50%;
    padding: 0 30px;
    height: 355px;
    background: #fff
}

#join .join7 .conBox .con .item .text .tit {
    text-align: right
}

#join .join7 .conBox .con .item .text .tit dt {
    font-size: 19px;
    font-weight: bold;
    padding: 10px 0;
    overflow: hidden
}

#join .join7 .conBox .con .item .text .tit dt img {
    display: inline-block;
    padding: 0 5px 0 0
}

#join .join7 .conBox .con .item .text .tit dd {
    font-size: 15px
}

#join .join7 .conBox .con .item .text ul {
    padding: 20px 0
}

#join .join7 .conBox .con .item .text ul li {
    font-size: 15px;
    line-height: 25px
}

#join .join7 .conBox .con .item .text h2.t {
    font-size: 18px;
    font-weight: normal;
    color: #b28a4c;
    padding: 20px
}

#join .join7 .conBox .con .item .text .desc {
    font-size: 14px;
    color: #1b1b1b;
    padding: 0 20px;
    line-height: 24px;
    height: 95px;
    overflow: hidden
}

#join .join7 .list a {
    display: block;
    margin: 5px 5px 5px 0;
    position: relative;
    height: 137px;
    overflow: hidden
}

#join .join7 .list img {
    width: 100%;
    heihgt: 100%
}

#join .join7 .list .bg {
    background: #000;
    opacity: .3
}

#join .join7 .list .active {
    border: 2px solid #b28a4c
}

#join .join7 .list .active .bg {
    opacity: 0
}

#join .join8 .procesList {
    padding: 100px 0 30px 0
}

#join .join8 .procesList dd {
    float: left;
    display: block;
    width: 12.5%;
    position: relative;
    cursor: pointer;
    height: 219px
}

#join .join8 .procesList .num {
    background: url(../images/y7.png) no-repeat #fff;
    width: 60px;
    height: 60px;
    margin-left: 2px;
    line-height: 60px;
    text-align: center;
    font-size: 20px;
    position: relative;
    z-index: 2
}

#join .join8 .procesList .y2 {
    background: url(../images/y8.png) no-repeat scroll center bottom;
    height: 0px;
    width: 100%;
    position: absolute;
    left: 0px;
    bottom: 0px;
    -webkit-transition: 400ms;
    -moz-transition: 400ms;
    -ms-transition: 400ms;
    transition: 400ms
}

#join .join8 .procesList .y {
    position: relative;
    z-index: 2
}

#join .join8 .procesList dd:hover .num {
    color: #fff
}

#join .join8 .procesList dd:hover .num .y2 {
    height: 100%
}

#join .join8 .procesList .line {
    width: 60%;
    right: 4px;
    top: 30px;
    height: 1px;
    background-color: #dcdcdc;
    position: absolute
}

#join .join8 .procesList .line2 {
    margin: 24px 0px 15px;
    width: 18px;
    background-color: #a0a0a0;
    height: 1px;
    -webkit-transition: 400ms;
    -moz-transition: 400ms;
    -ms-transition: 400ms;
    transition: 400ms
}

#join .join8 .procesList .txt {
    margin: 0px 45px 0px 5px;
    color: #000000;
    height: 135px;
    font-size: 14px;
}

#join .join8 .procesList dd:nth-child(2n) .txt {
    margin-top: -150px
}

#join .join8 .procesList dd:hover .line2 {
    width: 100%;
    background-color: #0fb5d0
}

#join .join10 .list {
    padding-bottom: 40px
}

#join .join10 .list a {
    float: left;
    width: 19%;
    padding: 5px;
    overflow: hidden;
    height: 103px
}

#join .join10 .list img {
    width: 100%
}

#join .feedback {
    height: 463px;
    background: url(../images/feedback_bg.jpg) center center no-repeat;
    text-align: center
}

#join .feedback h2 {
    font-size: 38px;
    color: #fff;
    font-weight: normal;
    padding: 115px 0 30px 0;
    line-height: 50px
}

#join .feedback .ly {
    padding: 50px 0;
    position: relative
}

#join .feedback input {
    display: inline-block;
    width: 200px;
    height: 50px;
    line-height: 50px;
    margin: 0 5px;
    background: url(../images/bg3.png);
    border: 2px solid #fff;
    font-size: 18px;
    border-radius: 5px;
    color: #fff;
    padding: 0 20px
}

#join .feedback button {
    height: 50px;
    width: 200px;
    background: #b28a4c;
    color: #fff;
    line-height: 50px;
    border: none;
    font-size: 18px;
    border-radius: 5px;
    margin-left: 20px
}

#join .feedback .Validform_checktip {
    font-size: 16px;
    position: absolute;
    top: 0px;
    left: 0;
    width: 100%;
    text-align: center
}

#join .feedback .Validform_wrong {
    color: red
}

#join .feedback input::-webkit-input-placeholder {
    color: #fff
}

#join .feedback input:-moz-placeholder {
    color: #fff
}

#join .feedback input::-moz-placeholder {
    color: #fff
}

#join .feedback input:-ms-input-placeholder {
    color: #fff
}

div.digg {
    font-size: 14px;
    overflow: hidden;
    width: 1200px;
    margin: auto;
    padding: 20px 0;
    text-align: left;
    color: #000
}

div.digg * {
    box-sizing: content-box
}

div.digg a {
    line-height: 20px;
    display: block;
    float: left;
    height: 20px;
    margin: 0 4px;
    padding: 5px 12px;
    text-decoration: none;
    color: #000;
    border: 1px solid #e1e2e3;
    background: #fff
}

div.digg a:hover {
    color: #fff;
    background: #415a69
}

div.digg span {
    line-height: 20px;
    display: block;
    float: left;
    height: 20px;
    padding: 5px
}

div.digg span.current {
    font-weight: bold;
    margin: 0 0 0 8px;
    padding: 5px 12px;
    color: #fff;
    background: #415a69
}

div.digg span.disabled {
    margin: 0 0 0 8px;
    padding: 5px 12px;
    color: #ddd;
    border: 1px solid #eee
}

.Smohan_Layer_box *, .Smohan_Layer_box {
    box-sizing: content-box
}

.Smohan_Layer_Shade {
    position: fixed;
    _position: absolute;
    zoom: 1;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    overflow: hidden;
    background: url(../images/bg.png) repeat;
    z-index: 99900
}

.Smohan_Layer_box {
    min-width: 300px;
    height: auto;
    padding: 20px;
    background: #ffffff;
    position: fixed;
    _position: absolute;
    top: 50%;
    left: 50%;
    overflow: hidden;
    z-index: 99999;
    -moz-border-radius: 20px;
    -webkit-border-radius: 20px;
    border-radius: 20px
}

.Smohan_Layer_box h3 {
    display: block;
    width: 100%;
    height: 30px;
    line-height: 30px;
    padding: 0px 0px 10px 0px;
    margin: 0;
    border-bottom: 1px solid #cccccc;
    overflow: hidden
}

.Smohan_Layer_box h3 .text {
    float: left;
    font-size: 16px;
    font-family: 'Microsoft JhengHei', 'Microsoft YaHei', Arial, sans-serif;
    font-weight: 600;
    color: #84c017;
    text-indent: 0.5em;
    display: block
}

.Smohan_Layer_box h3 .close {
    display: block;
    width: 30px;
    height: 30px;
    background: url(../images/smohan.layer.close.png) 0px 0px no-repeat;
    float: right
}

.Smohan_Layer_box h3 .close:hover {
    background-position: 0px -31px
}

.Smohan_Layer_box .layer_content {
    display: block;
    width: 100%;
    height: 100%;
    margin-top: 10px;
    margin-bottom: 10px;
    padding: 0;
    overflow: hidden;
    position: relative
}

.Smohan_Layer_box .layer_content .loading {
    display: block;
    width: 36px;
    height: 36px;
    background: url(../images/load.gif) center center no-repeat;
    position: absolute;
    top: 0;
    left: 0
}

#Share {
    display: none;
    width: 360px;
    height: 120px;
    padding: 15px 10px
}

#Share ul {
    margin: 0;
    padding: 0;
    list-style-type: none
}

#Share ul li {
    float: left;
    display: block;
    width: 50px;
    height: 50px;
    margin-left: 5px;
    margin-right: 5px;
    cursor: pointer;
    position: relative
}

#Share ul li a {
    display: block;
    width: 28px;
    height: 28px;
    margin-left: 11px;
    margin-top: 12px
}

#Share ul li span {
    display: block;
    width: 40px;
    height: 10px;
    background: url(../images/share_shade.png) 0px 0px no-repeat;
    position: absolute;
    left: 5px;
    bottom: 0px
}

#Share ul li a.share1 {
    background: url(../images/share_icon.png) 0px 0px
}

#Share ul li a.share2 {
    background: url(../images/share_icon.png) -28px 0px
}

#Share ul li a.share3 {
    background: url(../images/share_icon.png) -56px 0px
}

#Share ul li a.share4 {
    background: url(../images/share_icon.png) -84px 0px
}

#Share ul li a.share5 {
    background: url(../images/share_icon.png) -112px 0px
}

#Share ul li a.share6 {
    background: url(../images/share_icon.png) -140px 0px
}

@media screen and (max-width: 1440px) {
    #home .newsBox .listBox .con a {
        width: 23%;
        margin: 20px 1%
    }
}

@media screen and (max-width: 1366px) {
    #home .aboutBox .modern {
        margin-right: 0px
    }
    #news_list .listBox .con a {
        width: 31.333%
    }
}

@media screen and (max-width: 1280px) {
    .view_layer .arrows a {
        width: 60px;
        height: 150px;
        margin-top: -75px;
        background-position: 0 0
    }
    .view_layer .arrows a.prev:hover {
        background-position: 0 -170px
    }
    .view_layer .arrows a.prev:active {
        background-position: 0 -340px
    }
    .view_layer .arrows a.next {
        background-position: -80px 0
    }
    .view_layer .arrows a.next:hover {
        background-position: -80px -170px
    }
    .view_layer .arrows a.next:active {
        background-position: -80px -340px
    }
    #home .criteriaBox .cd-slider .text-con {
        padding: 0 40px
    }
    #home .newsBox .conBox .rightBox .list li .text {
        width: 73%
    }
}

@media screen and (max-width: 1200px) {
    #news_list .listBox .con a {
        width: 48%
    }
}

@media only screen and (max-width: 1024px) {
    #home .newsBox .listBox .con a {
        width: 31.3%;
        margin: 20px 1%
    }
    #home .aboutBox .modern {
        margin-right: 150px
    }
    #case .industryfix li {
        width: 48%;
        margin-right: 4%
    }
    #case .industryfix li:nth-child(3n+3) {
        margin-right: 4%
    }
    #case .industryfix li:nth-child(2n+2) {
        margin-right: 0
    }
    #case .industryfix li:hover figure img {
        transform: scale(1);
        -webkit-transform: scale(1);
        -moz-transform: scale(1)
    }
    #case .industryfix li:hover .industrytext {
        background: #fff
    }
    #case .industryfix li:hover .industrytext h4 {
        color: #000
    }
    #case .industryfix li:hover .industrytext .intdustrs span {
        color: #646464
    }
    #case .industryfix li:hover .industrytext b, #case .industryfix li .industrytext b {
        display: none
    }
}

/* proviews */
#pro_show {
    text-align: center;
    color: #434343;
    padding-bottom: 30px;
    background-color: #ebf0f3;
    overflow: hidden
}

#pro_show .con {
    width: 78%;
    padding: 38px 0px 0px;
    background-color: #fff;
    position: relative;
    overflow: hidden;
    margin-left: 20px;
    float: left;
    border: 1px solid #e4e4e4;
}

#pro_show .con .lbot {
    width: 100%;
    height: 8px;
    background-color: #2278b0;
    position: absolute;
    left: 0px;
    top: 0px;
}

#pro_show .con .lbot i {
    width: 160px;
    height: 8px;
    background-color: #23455b;
    display: block;
}

#pro_show .con .infoT {
    border-bottom: 1px solid #ccc;
    padding-bottom: 32px;
    margin: 0px 32px 30px;
    color: #989898;
    text-align: left;
    position: relative
}

#pro_show .con .infoT .t {
    font-size: 18px;
    color: #666;
    line-height: 1.2;
    margin-bottom: 14px
}

#pro_show .con .infoT .ntime {
    background: url(../images/new_i1.png) no-repeat scroll left center;
    padding: 4px 0px 2px 22px;
    margin-right: 12px
}

#pro_show .con .infoT .nease {
    background: url(../images/new_i2.png) no-repeat scroll left center;
    padding: 4px 0px 2px 28px
}

#pro_show .con .infoT .nsharp {
    float: right;
    display: block
}

#pro_show .con .nsharp a {
    padding-left: 20px;
    height: 20px;
    margin-left: 6px;
    display: inline-block;
    background: url(../images/sharp3.png);
    float: left
}

#pro_show .con .nsharp a.i1 {
    background-position: 0px 0px
}

#pro_show .con .nsharp a.i1:hover {
    background-position: 0px -20px
}

#pro_show .con .nsharp a.i2 {
    background-position: -50px 0px
}

#pro_show .con .nsharp a.i2:hover {
    background-position: -50px -20px
}

#pro_show .con .nsharp a.i3 {
    background-position: -95px 0px
}

#pro_show .con .nsharp a.i3:hover {
    background-position: -95px -20px
}

#pro_show .con .pageCon {
    overflow: hidden;
    line-height: 2;
    color: #666;
    font-size: 14px;
    text-align: justify;
    margin: 0px 32px;
    /*padding: 0 30px 50px 30px*/
}

#pro_show .con .pageCon img {
    max-width: 100%;
    width: 100%;
}

#pro_show .con .pageCon a:link, #pro_show .con .pageCon a:visited {
    color: #4f7cb7
}

#pro_show .con .pageCon a:active, #pro_show .con .pageCon a:hover {
    color: #c62923
}

#pro_show .con .infoPaging a {
    height: 48px;
    color: #fff;
    font: 14px/48px "microsoft yahei";
    width: 33.33%;
    float: left;
    display: block;
    text-align: center;
    background-color: #23455b;
    overflow: hidden;
}

#pro_show .con .infoPaging a.list {
    margin: 0px 0.1%;
    width: 33.03%
}

#pro_show .con .infoPaging a.list span {
    display: inline-block;
    color: #fff;
}

#pro_show .con .infoPaging a:hover {
    color: #fff;
    background-color: #182b37;
}

#pro_show .con .infoPaging a.pprev span {
    background: url(../images/pagign_l.png) no-repeat scroll left center;
    padding-left: 32px
}

#pro_show .con .infoPaging a.pnext span {
    background: url(../images/pagign_r.png) no-repeat scroll right center;
    padding-right: 32px
}

#pro_show h2 {
    font-size: 18px;
    color: #23455b;
    text-align: left;
    padding-left: 10px;
}

#pro_show h3 {
    font-size: 14px;
    font-weight: normal;
    border-bottom: 1px solid #dcdcdc;
    width: 100%;
    margin: auto;
    font-size: 18px;
    text-align: left;
    background: #23455b;
    color: #fff;
}

#pro_show .text-con {
    font-size: 14px;
    line-height: 25px;
    padding: 10px 140px
}

#pro_show .text-con img {
    max-width: 100%
}

#pro_show .botBox {
    padding: 50px 40px
}

#pro_show .botBox .paging {
    width: 80%;
    text-align: left;
    line-height: 30px;
    font-size: 14px
}

#pro_show .botBox .fr {
    width: 15%;
    text-align: right
}

#pro_show .botBox .fr .returnBtn {
    margin: 0 0 0 auto
}

#pro_show .redList {
    width: 1200px;
    margin: auto;
    background: #fff;
    margin-top: 30px
}

#pro_show .redList .list {
    padding: 0 50px
}

#pro_show .redList .list a {
    display: block;
    width: 100%;
    padding: 20px
}

#pro_show .redList .list a img {
    width: 100%
}

#pro_show .redList .list a h2 {
    color: #121212;
    font-weight: normal;
    font-size: 15px;
    padding: 10px 20px;
    margin: 0;
    transition: .5s
}

#pro_show .redList .list a:hover h2 {
    background: #23455b;
    color: #fff
}
.chanpin{
    
width: 1200px;
    
margin: 100px auto 0 auto;
    
overflow: hidden;
    
background: #fff;
    
padding: 10px;
}
.InpageSidebar01{width: 20%;float: left;}
.InpageSidebar01 .top{overflow: hidden;width: 100%;/* height: 80px; */background: #23455b;border-radius: 4px 4px 0 0;}
.InpageSidebar01 .top h2{/* text-indent: 28px; */background: url(../images/inpagesidebar01_icon01.png) no-repeat 215px center;line-height: 60px;font-size: 24px;/* padding: 10px; */color: #fff;font-weight: normal;background-color: #23455b;}
.InpageSidebar01 .top h2 a{color: #fff;text-decoration: none;font-weight: bold;text-align: left;}
.InpageSidebar01 .classify .box{border: 1px solid #e4e4e4;border-top: none;position: relative;}
.InpageSidebar01 .classify .box:last-child{
    
border-radius: 0 0 4px 4px;
}
.InpageSidebar01 {
}
.classify{background:#fff}
.InpageSidebar01 .classify .box:first-child{border-top: 1px solid #e4e4e4;}
.InpageSidebar01 .classify dl{padding: 14px 19px 18px 20px;}
.InpageSidebar01 .classify dt{font-size: 16px;color: #23455b;background: url(../images/mub02_jt03.png) no-repeat 194px 6px;line-height: 1.5;text-align: left;}
.InpageSidebar01 .classify dd{display: none;}
.InpageSidebar01 .classify dt a{color: #23455b;text-align: left;}
.InpageSidebar01 .classify dl:hover dd{display: block;}
.InpageSidebar01 .classify dd p{border-left: 1px solid #e4e4e4;height: 35px;line-height: 35px;} 
.InpageSidebar01 .classify dd p a{font-size: 15px;color: #333333;display: block;text-indent: 16px;text-decoration: none;text-align: left;}
.InpageSidebar01 .classify .box i{display: none;width: 3px;height: 100%;position: absolute;left: -1px;top: 0;background: #23455b;}
.InpageSidebar01 .classify .box:hover{background: #fefefe;}
.InpageSidebar01 .classify .box:hover i{display: block;}
.InpageSidebar01 .classify .box dt.cur{background: url(../images/mub02_jt04.png) no-repeat 194px 6px;font-weight: bold;}
.InpageSidebar01 .classify .box:hover dt a,.InpageSidebar01 .classify .box dt.cur a{color: #000000;display: block;text-decoration: none;}
.InpageSidebar01 .classify .box:hover dt{background: url(../images/mub02_jt04.png) no-repeat 194px 6px;font-weight: bold;}
.InpageSidebar01 .classify dd p:hover a,.InpageSidebar01 .classify dd p.cur a{color: #fff;}
.InpageSidebar01 .classify dd p:hover,.InpageSidebar01 .classify dd p.cur{background: url(../images/mub02_jt02.png) no-repeat 194px center #23455b;}
.InpageSidebar01 .sidebarLinkUs{border: 1px solid #e4e4e4;border-radius: 4px;margin-top: 10px;/* background: #fff; */text-align: left;}
.InpageSidebar01 .sidebarLinkUs h3{font-size: 18px;color: #000000;font-weight: normal;height: 60px;line-height: 60px;border-bottom: 1px solid #e4e4e4;margin-bottom: 18px;text-indent: 10px;}
.InpageSidebar01 .sidebarLinkUs p{font-size: 14px;color: #333333;line-height: 2.5;padding: 0 10px;}
.InpageSidebar01 .sidebarLinkUs .zxzx{display: block;overflow: hidden;background: #23455b;text-decoration: none;margin-top: 20px;border-radius: 4px;}
.InpageSidebar01 .sidebarLinkUs .zxzx span{display: block;width: 50px;height: 50px;float: left;border-right: 1px solid #fff;background: url(../images/zxzx_icon01.png) no-repeat center;}
.InpageSidebar01 .sidebarLinkUs .zxzx em{display: block;width: 77%;height: 50px;line-height: 50px;text-align: center;font-size: 16px;color: #fff;float: left;}
.InpageSidebar01 .sidebarLinkUs .zxzx em img{display: inline-block;*display: inline-block;position: relative;top: 2px;margin-left: 8px;}


.mub02address{width: 100%;border-bottom: 1px solid #e4e4e4;}
.mub02address .con{width: 100%;height: 43px;}
.mub02address .homePage{display: block;width: 43px;height: 43px;background: url(../images/mub02address_homepage.png) no-repeat center;float: left;border-left: 1px solid #eaeaea;border-right: 1px solid #eaeaea;}
.mub02address p{height: 43px; width:84%; line-height: 43px;font-size: 13px;color: #999999;float: left;margin-left: 18px;    overflow: hidden; white-space: nowrap; text-overflow: ellipsis;}
.mub02address p a{color: #999999;padding: 0 4px;}
.mub02address .backList{display: block;width: 117px;height: 43px;line-height: 43px;text-align: center;border-left: 1px solid #eaeaea;border-right: 1px solid #eaeaea;float: right;font-size: 13px;color: #999999;text-decoration: none; cursor:pointer;}
.mub02address .backList img{display: inline-block;*display: inline-block;margin-right: 10px;position: relative;top: 2px;}